div绑定鼠标离开事件，隐藏div，但是我快速离开时，div不会隐藏
自学的人
2017-01-12 17:10
<div class="left">
<div id="a1-1">第一个DIV</div>
<div id="a1">第一个DIV</div>
<div id="a2-2">第二个DIV</div>
<div id="a2">第二个DIV</div>
<div id="a3-3">第三个DIV</div>
<div id="a3">第三个DIV</div>
<div id="a4-4">第四个DIV</div>
<div id="a4">第思个DIV</div>
<div id="a5-5">第五个DIV</div>
<div id="a5">第五个DIV</div>
<script type="text/javascript">
$("#a1-1,#a2-2,#a3-3,#a4-4,#a5-5").mouseover(function() {
$(this).hide(1000);
$(this).next().show(1000);
});
$("#a1,#a2,#a3,#a4,#a5").mouseout(function() {
$(this).hide(1000);
$(this).prev().show(1000);
});
</script>
</div>
1回答
-
- 我就叫李二毛
- 2017-01-12 22:56:10
我不知道你想表达什么。你的代码，我们分析一下，初始是全部都显示的。
当鼠标移入#a1-1,#a2-2,#a3-3,#a4-4,#a5-5 id为这些的时候，这些div隐藏。时间为1s。然后#a1-1,#a2-2,#a3-3,#a4-4,#a5-5这些div的下面的兄弟开始显示，时间为一秒，（这时候下面的#a1,#a2,#a3,#a4,#a5" 也就是这些已经是显示的，所以没效果。）当你鼠标移出（#a1,#a2,#a3,#a4,#a5"），这些的时候，你设置的是隐藏，时间为1s，但是你的下一句$(this).prev().show(1000); 这个，又将上面的（#a1-1,#a2-2,#a3-3,#a4-4,#a5-5）这些给显示出来。所以你鼠标移入移出的时候，活循环调用（#a1-1,#a2-2,#a3-3,#a4-4,#a5-5），这些和（#a1,#a2,#a3,#a4,#a5）这些的显示隐藏啊，效果就看像两个div来回切换的样子啊。我觉得是你写的代码有问题，你自己在好好寻思寻思。
jQuery基础(四)—动画篇
85058 学习 · 262 问题
相似问题