hoverintent插件与我需要的相反.
我有一个由.trigger触发的.popup,当我将它悬停时,我希望.popup不会淡出几秒钟,但如果我将其悬停,然后再次悬停,则取消将要发生的淡出并保持.popup打开.
我有一个由.trigger触发的.popup,当我将它悬停时,我希望.popup不会淡出几秒钟,但如果我将其悬停,然后再次悬停,则取消将要发生的淡出并保持.popup打开.
有谁知道我会怎么做？
这不起作用,但这是一个想法：
$('.trigger').hover(function(){
$('.popup').fadeIn(600)
},function() {
$('.popup').delay(2000,function(){
if ($(this).blur() = true) {
$('.popup').fadeOut(600)
}
});
})
解决方法
jQuery
HoverIntent plugin正是您所寻找的.
timeout属性将设置在调用out函数之前鼠标需要超出该区域的时间.
来自悬停意图网站的报价：
timeout:
A simple delay,in milliseconds,before the “out” function is called. If the user mouses back over the element before the timeout has expired the “out” function will not be called (nor will the “over” function be called). This is primarily to protect against sloppy/human mousing trajectories that temporarily (and unintentionally) take the user off of the target element… giving them time to return. Default timeout: 0
设置它……
$('.trigger').hoverIntent({
over: startHover,out: endHover,timeout: 2000
});
然后定义要处理的函数
function startHover(e){
//your logic here
$('.popup').fadeIn(600)
}
function endHover(){
//your logic here
$('.popup').fadeOut(600)
}
编辑：
您还可以调整interval属性以增加/减少startHover函数触发的时间…默认设置为100毫秒…您可以将其设置为零以立即触发弹出窗口如果您愿意,进入触发区域.
