自己用jQuery写的tooltip为什么tooltip只能出现一次?

HTML和JS代码如下:

<div class="wrap">
    <p>tooltip<a data-tooltip="tooltip1">tooltip1</a></p>
    <p>tooltip<a data-tooltip="tooltip2">tooltip2</a></p>
    <p>tooltip<a data-tooltip="tooltip3">tooltip3</a></p>
    <p>tooltip<a data-tooltip="tooltip4">tooltip4</a></p>
    <span id="tooltip"></span>

</div>
<!--<script type="text/javascript" src="jquery-2.2.1.js"></script>-->
<script type="text/javascript">
    $(function(){
        $('a[data-tooltip*=tooltip]').each(function(){
            $(this).mouseover(function(){
                     var tooltip=$(this).attr('data-tooltip');
                     var left=$(this).position().left;
                     var top =$(this).position().top+20;
                     showTooltip(tooltip,left,top,true)
                    }
            );
            $(this).mouseout(function(){
                showTooltip('','','',false)
            })
        });
        function showTooltip(html,left,top,bool){
            if(bool){
              $("#tooltip").html(html).css('visibility','visible').css({'left':left,'top':top})
            }else{
                setTimeout( $("#tooltip").hide(),300)
            }
        }
    })

hover上去时tooltip出现一次第二次就没了。

阅读 3k
2 个回答

少年,把你的css('visibility','visible')改成show(),jq的hide()是调整display属性滴,你显示的时候用的是visibility属性,改一下就好了。

mouseout不是hide()了么?

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题