edt*_*edt 1 javascript jquery viewport hover jquery-hover
下面的代码将div放在视图端口的最顶部.
预期的行为是:
当用户将鼠标悬停在div上时,然后向上移动鼠标直到光标离开视口,应在控制台中记录"悬停"消息.问题是没有任何内容记录到控制台.
当鼠标离开视口时,如何让JQuery .hover()将某些内容记录到控制台?
<body style="margin: 0; padding: 0;">
<div class="foo" style="background-color: blue; width: 100px; height: 100px;">
Test
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script>
$(".foo").hover(function(){
console.log("hover in");
}, function(){
console.log("hover out");
});
</script>
Run Code Online (Sandbox Code Playgroud)
使用mouseover而mouseout不是hover似乎修复它.
$(".foo").mouseover(function(){
console.log("hover in");
});
$(".foo").mouseout(function(){
console.log("hover out");
});
Run Code Online (Sandbox Code Playgroud)
请注意,如果浏览器窗口周围没有镶边,即使这样也行不通.例如,当我最大化FF4或将其置于全屏模式时,浏览器窗口的边缘与我的屏幕边缘齐平,因此在这种情况下光标无法转到div的左侧,因此鼠标移动事件永远不会开火.
| 归档时间: |
|
| 查看次数: |
5624 次 |
| 最近记录: |