禁用默认工具提示 [英] Disabling default tooltip

问题描述

这是一个工具提示脚本， http://www. alessioatzeni.com/blog/simple-tooltip-with-jquery-only-text/.它在所有浏览器中都很好用，但是IE中并未禁用默认工具提示.

Here's a tooltip script, http://www.alessioatzeni.com/blog/simple-tooltip-with-jquery-only-text/. It works great in all the browsers but the default tooltip isn't disabled in IE.

如何更新以下脚本以禁用默认工具提示?

How can i update the following script to disable the default tooltip?

<script type="text/javascript">
$(document).ready(function() {
   // Tooltip only Text
   $('.masterTooltip').hover(function(){
         // Hover over code
         var title = $(this).attr('title');
         $(this).data('tipText', title).removeAttr('title');
         $('<p class="tooltip"></p>').text(title).appendTo('body').fadeIn('slow');
    }, function() {
         // Hover out code
         $(this).attr('title', $(this).data('tipText'));
         $('.tooltip').remove();
    }).mousemove(function(e) {
          var mousex = e.pageX + 20; //Get X coordinates
          var mousey = e.pageY + 10; //Get Y coordinates
          $('.tooltip').css({ top: mousey, left: mousex })
    });
});
</script>

推荐答案

我看不出有任何理由在模糊时将title属性重新添加到元素中.您已将其存储在jQuery元数据中.我的猜测是这就是IE仍在显示它的原因.删除行

I don't see any reason to add the title attribute back in to the element on blur. You have it stored in the jQuery metadata. My guess is that is why IE is still showing it. Remove the line

        $(this).attr('title', $(this).data('tipText'));

看看是否可以解决.

错过了一些要求.这未经测试，但可能有效:

That missed some requirements. This is untested, but might work:

$(document).ready(function() {
    $('.masterTooltip').each(function() {
        var title = $(this).attr('title');
        $(this).data('tipText', title).removeAttr('title');
    }).hover(function(){
        $('<p class="tooltip"></p>')
        .text($(this).data('tipText'))
        .appendTo('body')
        .fadeIn('slow');
    }, function() {
        $('.tooltip').remove();
    }).mousemove(function(e) {
        var mousex = e.pageX + 20;
        var mousey = e.pageY + 10;
        $('.tooltip')
        .css({ top: mousey, left: mousex })
    });
}); 

请注意，这是次优的，因为它在each块中两次调用了$(this)，但这应该很容易修复.

Note that this is sub-optimal, as it calls $(this) twice in the each block, but that should be easy enough to fix.

这篇关于禁用默认工具提示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！