2011-05-05 63 views
0

我希望有人能够提供帮助。显示在IE中的jQuery Tipsy工具提示的本地浏览器工具提示

我已经实现了jQuery Tipsy插件,它在除IE以外的所有浏览器中都能正常工作。目前,在IE首次加载页面时,显示的是令人兴奋的工具提示和本地浏览器工具提示。如果您然后刷新页面,则只会显示醉意的页面。

我试着下载演示页面使用的脚本代替(因为问题似乎没有发生) - 但是我的工具提示出现在屏幕上。

有没有其他人经历过这个问题,如果是的话,你是如何解决这个问题的?或者,如果有人知道如何删除本机工具提示,将不胜感激。

的JS低于...(从http://onehackoranother.com/projects/jquery/tipsy/下载)

(function($) { 

$.fn.tipsy = function(options) { 

    options = $.extend({}, $.fn.tipsy.defaults, options); 

    return this.each(function() { 

     var opts = $.fn.tipsy.elementOptions(this, options); 

     $(this).hover(function() { 

      $.data(this, 'cancel.tipsy', true); 

      var tip = $.data(this, 'active.tipsy'); 
      if (!tip) { 
       tip = $('<div class="tipsy"><div class="tipsy-inner"/></div>'); 
       tip.css({position: 'absolute', zIndex: 100000}); 
       $.data(this, 'active.tipsy', tip); 
      } 

      if ($(this).attr('title') || typeof($(this).attr('original-title')) != 'string') { 
       $(this).attr('original-title', $(this).attr('title') || '').removeAttr('title'); 
      } 

      var title; 
      if (typeof opts.title == 'string') { 
       title = $(this).attr(opts.title == 'title' ? 'original-title' : opts.title); 
      } else if (typeof opts.title == 'function') { 
       title = opts.title.call(this); 
      } 

      tip.find('.tipsy-inner')[opts.html ? 'html' : 'text'](title || opts.fallback); 

      var pos = $.extend({}, $(this).offset(), {width: this.offsetWidth, height: this.offsetHeight}); 
      tip.get(0).className = 'tipsy'; // reset classname in case of dynamic gravity 
      tip.remove().css({top: 0, left: 0, visibility: 'hidden', display: 'block'}).appendTo(document.body); 
      var actualWidth = tip[0].offsetWidth, actualHeight = tip[0].offsetHeight; 
      var gravity = (typeof opts.gravity == 'function') ? opts.gravity.call(this) : opts.gravity; 

      switch (gravity.charAt(0)) { 
       case 'n': 
        tip.css({top: pos.top + pos.height, left: pos.left + pos.width/2 - actualWidth/2}).addClass('tipsy-north'); 
        break; 
       case 's': 
        tip.css({top: pos.top - actualHeight, left: pos.left + pos.width/2 - actualWidth/2}).addClass('tipsy-south'); 
        break; 
       case 'e': 
        tip.css({top: pos.top + pos.height/2 - actualHeight/2, left: pos.left - actualWidth}).addClass('tipsy-east'); 
        break; 
       case 'w': 
        tip.css({top: pos.top + pos.height/2 - actualHeight/2, left: pos.left + pos.width}).addClass('tipsy-west'); 
        break; 
      } 

      if (opts.fade) { 
       tip.css({opacity: 0, display: 'block', visibility: 'visible'}).animate({opacity: 0.8}); 
      } else { 
       tip.css({visibility: 'visible'}); 
      } 

     }, function() { 
      $.data(this, 'cancel.tipsy', false); 
      var self = this; 
      setTimeout(function() { 
       if ($.data(this, 'cancel.tipsy')) return; 
       var tip = $.data(self, 'active.tipsy'); 
       if (opts.fade) { 
        tip.stop().fadeOut(function() { $(this).remove(); }); 
       } else { 
        tip.remove(); 
       } 
      }, 100); 

     }); 

    }); 

}; 

// Overwrite this method to provide options on a per-element basis. 
// For example, you could store the gravity in a 'tipsy-gravity' attribute: 
// return $.extend({}, options, {gravity: $(ele).attr('tipsy-gravity') || 'n' }); 
// (remember - do not modify 'options' in place!) 
$.fn.tipsy.elementOptions = function(ele, options) { 
    return $.metadata ? $.extend({}, options, $(ele).metadata()) : options; 
}; 

$.fn.tipsy.defaults = { 
    fade: false, 
    fallback: '', 
    gravity: 'n', 
    html: false, 
    title: 'title' 
}; 

$.fn.tipsy.autoNS = function() { 
    return $(this).offset().top > ($(document).scrollTop() + $(window).height()/2) ? 's' : 'n'; 
}; 

$.fn.tipsy.autoWE = function() { 
    return $(this).offset().left > ($(document).scrollLeft() + $(window).width()/2) ? 'e' : 'w'; 
}; 

})(jQuery的);

在此先感谢。

回答