Question

我想知道当鼠标离开身体顶部边界时是否有办法捕获某种鼠标事件或其他事件？

当用户离开body元素并且未设置cookie时，我在我的网站上有此广告系列我只向他们显示此弹出窗口一次。但是这个事件触发了身体的各个方面。

tr =休假时触发事件

我想：

            tr
       +----------+
       |          |
  no-tr|          |no-tr
       |          |
       +----------+
          no-tr

但我有

             tr
       +----------+
       |          |
     tr|          |tr
       |          |
       +----------+
          tr

我有这样的事情：

$("body").one("mouseleave", initPopup)

我的问题是，只有当用户通过顶部边框离开身体而不是其他边界时才有触发此事件的方法吗？

Answer 1

您可以使用e.offsetY并检查它是否小于0.偏移量是从元素的左上角计算的，Y向下增加。如果e.offsetY小于0，则表示当鼠标移动到连接了事件处理程序的元素上方时触发了事件。

如果滚动页面，则需要考虑scrollTop值，因为offsetY将具有元素顶角的偏移位置，即使它从屏幕顶部滚动。

由于即使鼠标在另一侧移出也会触发事件，但您无法使用.one()，而是可以添加一个条件来检查事件是否已从＆＃触发34;鼠标离开＆＃34;在顶部。

DEMO

triggered = false;
$("body").on("mouseleave", function (e) {
    if (e.offsetY - $(window).scrollTop() < 0 && !triggered) {
        triggered = true;
        alert("leave");
    }
});

Answer 2

您可以使用jquery尝试此操作：

$('#element').mouseout(function(e) {
if (e.offsetY < 0) {
 //   your event
}
});

编辑：编辑了底边的no-tr的答案。没有注意到有问题！

捕获鼠标离开身体元素越过顶部边界

2 个答案: