Jquery 在包含目标的区域之外时隐藏qTip
我只想在目标上方的鼠标上显示qtip(Jquery 在包含目标的区域之外时隐藏qTip,jquery,hide,qtip,mouseleave,qtip2,Jquery,Hide,Qtip,Mouseleave,Qtip2,我只想在目标上方的鼠标上显示qtip(),但我想保持可见,直到我将鼠标移到包含常规元素的外部(您需要执行以下操作: 检查qtip在红色块上时是否保持打开状态。将jquery委托更改为on方法。“从jquery 1.7开始,.delegate()已被.on()方法取代。” //other HTML //don't hide tooltip if anywhere in this div <div class="profileArea"> <span class="pr
),但我想保持可见,直到我将鼠标移到包含常规元素的外部(您需要执行以下操作:
检查qtip在红色块上时是否保持打开状态。将jquery委托更改为on方法。“从jquery 1.7开始,.delegate()已被.on()方法取代。”
//other HTML
//don't hide tooltip if anywhere in this div
<div class="profileArea">
<span class="profileInner">Your Profile: 0
<span class="fullProfileBar">
<span class="completedProfileBar"></span>
</span>
//start showing when hover over this span
<span class="percent100"> 100%</span>
</span>
</div>
//other HTML
$('.percent100').qtip({
id: 'progressBarTooltip',
content: {
text: 'Text Here'
},
position: {
my: 'top right',
at: 'bottom right',
target: $('.percent100')
},
show: {
event: 'mouseover' //shows when hover .percent100
},
hide: {
fixed: true,
//trying to hide when leave
target: $("div[class!='profileArea']")
},
});
// Create the tooltips only when document ready
$(document).ready(function() {
// MAKE SURE YOUR SELECTOR MATCHES SOMETHING IN YOUR HTML!!!
$('a').qtip({
hide: {
delay: 400
},
events: {
render: function(event, api) {
// All elements with class 'safe' will set the 'safe' flag in the API cache
$(document.body).delegate('.safe', 'mouseenter mouseleave', function(event) {
api.cache.safe = event.type === 'mouseenter';
// This will hide the tooltip if we mouse out of the "safe" elements
if(!api.cache.safe) { api.hide(event); }
});
},
hide: function(event, api) {
// Check we're currently on a "safe" element, and stop the hide if so
if(api.cache.safe) {
try { event.preventDefault(); }
catch (e) {} // Needed for old IE and jQuery versions
}
}
}
});
});