js判断鼠标同时离开两个div的思路及代码

时间:2021-05-26

纠结了两天,憋出了个蛋,欢迎拍砖!!!
复制代码 代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://ment/jquery-1.6.2.min.js"></script>
<script type="text/javascript">
jQuery(function(){
window.a=0; window.b=1 ; //同为1隐藏弹层
$('ul').delegate('.grid','mouseover',function(){ // 鼠标放在头像上
if($('.f')){
$('ul').append('<div class="f"></div>')
$('.f').css({top:$(this).offset().top})
}
window.a=0;
$('.f').show();
})

$('ul').delegate('.f','mouseover',function(){// 鼠标在弹层上
window.b=0;
});
$('ul').delegate('.grid','mouseout',function(){// 鼠标离开头像
window.a=1;
})
$('ul').delegate('.f','mouseout',function(){// 离开弹层
window.b=1;
});

setInterval(function(){//console.log(window.a +" "+ window.b +" "+ window.c);
if(window.a&&window.b){
$('.f').hide();
}
},100)
})
</script>
</head>

<body>
<ul>
<li><div class="grid"></div></li>
<li><div class="grid"></div></li>
<li><div class="grid"></div></li>
<li><div class="grid"></div></li>
<li><div class="grid"></div></li>
<li><div class="grid"></div></li>
<li><div class="grid"></div></li>
<li><div class="grid"></div></li>
<li><div class="grid"></div></li>
<li><div class="grid"></div></li>
</ul>

</body>
</html>

声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。

相关文章