mouseOver()滑稽行为
mouseOver()滑稽行为
提问于 2012-01-20 20:23:51
我很好奇为什么当我鼠标鼠标离开标题时蓝色<div>消失了，而不是只有当鼠标离开整个<div>时才消失。
$("#yw1 .portlet-title").mouseover(function(){
$("#yw1 .portlet-content").slideDown('fast');
});
$("#yw1").mouseout(function(){
$("#yw1 .portlet-content").slideUp('fast');
});这里是一个演示jsFiddle。
回答 3
Stack Overflow用户
回答已采纳
发布于 2012-01-20 20:27:37
原因是因为mouseout事件泡沫化，也就是说，当你鼠标离开任何一个孩子，祖先仍然会收到这个事件。您可以通过检查当前目标(this)的目标来修复这个问题。这是一个更新的jsFiddle。
$("#yw1").mouseout(function(e) {
if(e.target === this) {
$("#yw1 .portlet-content").slideUp('fast');
}
});Stack Overflow用户
发布于 2012-01-20 20:31:28
使用jQuery的莫塞莱而不是mouseout。
Stack Overflow用户
发布于 2012-01-20 20:31:31
其原因是鼠标掉下来的事件会冒泡并隐藏起来。使用mouseneter和mouseleave事件来解决这个问题。
$("#yw1 .portlet-title").mouseenter(function(){
$("#yw1 .portlet-content").slideDown('fast');
});
$("#yw1").mouseleave(function(){
$("#yw1 .portlet-content").slideUp('fast');
});演示
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/8947420
复制相关文章
相似问题
腾讯云开发者
