Question

我听到它很难但可能。我只是想这样做，因为我使用以下jquery代码来避免缓慢且非常小的默认提示显示（对于＆amp; img标签中的title和alt属性）。

$(function() {
$('a').hover(function(e) {
       e.preventDefault();
     if(this.title > '')
       {
    this.t = this.title;
   // this.title = '';
    $(this).append("<span id='tooltip'>"+ this.t +"</span>");
    $("#tooltip")
      .css("top",(e.pageY - 20) + "px")
      .css("left",(e.pageX + 3) + "px")
      .fadeIn("fast");

       }
   },
  function () {
    $(this).find("span:last").remove();
   }
 );
});

现在，如果我发布了//this.title ='';在代码中 - 它可以工作，但工具提示只运行一次，在下一个悬停时没有重放。

任何想法如何覆盖？ THX。

Answer 1

编辑：example jsFiddle

我喜欢qTip，但如果你想推出自己的代码，我就这样做......

$(function(){
  // remove all titles and create tooltip span
  $('a[title]').each(function(){
    var s = $("<span class='tooltip'>"+ this.title +"</span>").hide();
    $(this).append(s).removeAttr("title");
  });

  // setup hover functions
  // tooltip spans are already present
  // we just need to position and show them or hide them
  $('a').hover(function(e){
    $(this).find("span.tooltip").css({
      top: (e.pageY - 20) + "px",
      left: (e.pageX + 3) + "px"
    }).fadeIn("fast");
  },
  function(){
    $(this).find("span.tooltip").fadeOut("fast");
  });
});

Answer 2

忽略我的最后一个答案，我刚刚完成了一个Moosehead。

$('a').hover(function(e) {
      e.preventDefault();
      var title = $(this).attr('title');

      // assign the original title to the "tt" attribute
      $(this).attr('tt', title);  

      $(this).removeAttr('title');
      $(this).append("<span id='tooltip'>" + title + "</span>");

      $("#tooltip").css("top", (e.pageY - 20) + "px").css("left", (e.pageX + 3) + "px").fadeIn("fast");
    }, function() {    

      // assign it back to what it was
      $(this).attr('title', $(this).attr('tt'));

      $(this).find("span:last").remove();
    }
};

如何以跨浏览器方式防止默认工具提示显示？

2 个答案: