jQuery bt气泡实现悬停显示及移开隐藏功能的方法

本文实例讲述了jQuery bt气泡实现悬停显示及移开隐藏功能的方法。分享给大家供大家参考，具体如下：

jQuery.bt.options.closeWhenOthersOpen = true;
$("img.eq-message").bt({
    trigger:["mouseover", "click"],
    contentSelector:"$(this).next().html()",
    positions:["left", "bottom"],
    fill:"#FFD97A",
    strokeWidth: 0,
    shadow: true,
    shadowOffsetX: 3,
    shadowOffsetY: 3,
    shadowBlur: 8,
    shadowColor: "rgba(0,0,0,.9)",
    shadowOverlap: false,
    noShadowOpts: {strokeStyle: "#999", strokeWidth: 2},
});
var hideDelayTimer = null;
var hideDelayTimer2 = null;
$("div.bt-content").live("mouseover", function(e){
    if (hideDelayTimer) clearTimeout(hideDelayTimer);
    if (hideDelayTimer2) clearTimeout(hideDelayTimer2);
});
$("div.bt-content").live("mouseout", function(e){
    if (hideDelayTimer) clearTimeout(hideDelayTimer);
    hideDelayTimer2 = setTimeout(function(){
      $("div.bt-wrapper").remove();
    }, 100);
});
$("img.eq-message").mouseover(function(){
    if (hideDelayTimer2) clearTimeout(hideDelayTimer2);
    if (hideDelayTimer) clearTimeout(hideDelayTimer);
}).mouseout(function(){
    hideDelayTimer = setTimeout(function(){
      $("div.bt-wrapper").remove();
    }, 100);
});

附：jQuery.bt.min.js插件完整代码如下：

复制代码 代码如下:

/*

* @name BeautyTips

* @desc a tooltips/baloon-help plugin for jQuery

*

* @author Jeff Robbins - Lullabot - http://www.lullabot.com

* @version 0.9.5-rc1 (5/20/2009)

*/

jQuery.bt={version:"0.9.5-rc1"};(function($){jQuery.fn.bt=function(content,options){if(typeof content!="string"){var contentSelect=true;options=content;content=false;}else{var contentSelect=false;}if(jQuery.fn.hoverIntent&&jQuery.bt.defaults.trigger=="hover"){jQuery.bt.defaults.trigger="hoverIntent";}return this.each(function(index){var opts=jQuery.extend(false,jQuery.bt.defaults,jQuery.bt.options,options);opts.spikeLength=numb(opts.spikeLength);opts.spikeGirth=numb(opts.spikeGirth);opts.overlap=numb(opts.overlap);var ajaxTimeout=false;if(opts.killTitle){$(this).find("[title]").andSelf().each(function(){if(!$(this).attr("bt-xTitle")){$(this).attr("bt-xTitle",$(this).attr("title")).attr("title","");}});}if(typeof opts.trigger=="string"){opts.trigger=[opts.trigger];}if(opts.trigger[0]=="hoverIntent"){var hoverOpts=jQuery.extend(opts.hoverIntentOpts,{over:function(){this.btOn();},out:function(){this.btOff();}});$(this).hoverIntent(hoverOpts);}else{if(opts.trigger[0]=="hover"){$(this).hover(function(){this.btOn();},function(){this.btOff();});}else{if(opts.trigger[0]=="now"){if($(this).hasClass("bt-active")){this.btOff();}else{this.btOn();}}else{if(opts.trigger[0]=="none"){}else{if(opts.trigger.length>1&&opts.trigger[0]!=opts.trigger[1]){$(this).bind(opts.trigger[0],function(){this.btOn();}).bind(opts.trigger[1],function(){this.btOff();});}else{$(this).bind(opts.trigger[0],function(){if($(this).hasClass("bt-active")){this.btOff();}else{this.btOn();}});}}}}}this.btOn=function(){if(typeof $(this).data("bt-box")=="object"){this.btOff();}opts.preBuild.apply(this);$(jQuery.bt.vars.closeWhenOpenStack).btOff();$(this).addClass("bt-active "+opts.activeClass);if(contentSelect&&opts.ajaxPath==null){if(opts.killTitle){$(this).attr("title",$(this).attr("bt-xTitle"));}content=$.isFunction(opts.contentSelector)?opts.contentSelector.apply(this):eval(opts.contentSelector);if(opts.killTitle){$(this).attr("title","");}}if(opts.ajaxPath!=null&&content==false){if(typeof opts.ajaxPath=="object"){var url=eval(opts.ajaxPath[0]);url+=opts.ajaxPath[1]?" "+opts.ajaxPath[1]:"";}else{var url=opts.ajaxPath;}var off=url.indexOf(" ");if(off>=0){var selector=url.slice(off,url.length);url=url.slice(0,off);}var cacheData=opts.ajaxCache?$(document.body).data("btCache-"+url.replace(/./g,"")):null;if(typeof cacheData=="string"){content=selector?$("