jquery问题,鼠标移除间隔一秒隐藏div层,鼠标移上去继续显示div,一秒内可反复移入移除
//三级联动(定时隐藏)functionmenu4(menuItems,secA,secHover,ddHover,secsub){$(menuItems).hover(...
//三级联动(定时隐藏)
function menu4(menuItems, secA, secHover, ddHover, secsub){
$(menuItems).hover(function(){
$(this).addClass("hover");
var pos1=$(this).offset();
var second=$(this).find("div").find("span");
//$(this).find("div").css('left',0);
if (second.length > 0){
$(this).find("div").slideDown(100);
$.each(second, function(n,value){
$('#'+value.id).hover(function(){
$(this).find(secA).addClass(secHover);
var pos=$(this).offset();
var three=$(this).find("dl");
if (three.length > 0){
three.css('top',pos.top-148);
three.css('left',124);
three.css('z-index',122);
three.slideDown(100);
var three_item=$(this).find("dd");
$.each(three_item, function(n,value){
$('#'+value.id).hover(function(){
$(this).addClass(ddHover);
},function(){
$(this).removeClass(ddHover);
})
});
}
}, function() {
$(this).find(secA).removeClass(secHover);
$(this).find("dl").hide();
});
});
}
}, function() {
$(secsub).mouseleave(function(){//鼠标移开1秒钟元素消失
var hideTimer=setInterval(function(){
$(secsub).parent().find("div").hide();
$(secsub).removeClass("hover");
},1000);
});
$(secsub).mouseout(function(){//鼠标进去元素区域,元素不消失
clearInterval(hideTimer);//清除计时器
});
});
}
为啥第一次可以实现,多几次反复移入移除后,就算光标在上面还是会在1秒后隐藏div层?求高手指点! 展开
function menu4(menuItems, secA, secHover, ddHover, secsub){
$(menuItems).hover(function(){
$(this).addClass("hover");
var pos1=$(this).offset();
var second=$(this).find("div").find("span");
//$(this).find("div").css('left',0);
if (second.length > 0){
$(this).find("div").slideDown(100);
$.each(second, function(n,value){
$('#'+value.id).hover(function(){
$(this).find(secA).addClass(secHover);
var pos=$(this).offset();
var three=$(this).find("dl");
if (three.length > 0){
three.css('top',pos.top-148);
three.css('left',124);
three.css('z-index',122);
three.slideDown(100);
var three_item=$(this).find("dd");
$.each(three_item, function(n,value){
$('#'+value.id).hover(function(){
$(this).addClass(ddHover);
},function(){
$(this).removeClass(ddHover);
})
});
}
}, function() {
$(this).find(secA).removeClass(secHover);
$(this).find("dl").hide();
});
});
}
}, function() {
$(secsub).mouseleave(function(){//鼠标移开1秒钟元素消失
var hideTimer=setInterval(function(){
$(secsub).parent().find("div").hide();
$(secsub).removeClass("hover");
},1000);
});
$(secsub).mouseout(function(){//鼠标进去元素区域,元素不消失
clearInterval(hideTimer);//清除计时器
});
});
}
为啥第一次可以实现,多几次反复移入移除后,就算光标在上面还是会在1秒后隐藏div层?求高手指点! 展开
2014-09-18
展开全部
<style>
#menu li{float:left:position:relative;line-height:35px;}
#menu li .sub{width:300px;height:300px; background-color:#000;position:absolute;left:0;top:0;display:none;}
</style>
<ul id="menu"><li><a href="a">aaaa</a><div class="sub"></div></li>
<script>
var nav=$("#menu li");
var tm;
li.hover(function(){
var a=$(this).find(".sub");
if(tm){
clearTimeout(tm);
}
a.show();
$(this).attr("data-id","1");
},function(){
var a=$(this).find(".sub");
tm=setTimeout(function(){$(this).attr("data-id","0");a.hide();},1000);
});
</script>
简单来将在li如果之前有过划入,并且离开后倒计时没结束,那么在此划入不会改变他的显示状态。如果前面的倒计时还在那就清除倒计时重新开始。
追问
不行啊,试了下!
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询