通过绝对定位的元素传递鼠标事件

2022-08-29 23:37:48

我正在尝试在一个元素上捕获鼠标事件,该元素上有另一个绝对定位的元素。

现在,绝对定位元素上的事件会击中它并冒泡到它的父级,但我希望它对这些鼠标事件是“透明的”,并将它们转发到它后面的任何东西上。我应该如何实现这一点?


答案 1
pointer-events: none;

一个 CSS 属性,它使事件“传递”到应用该属性的 HTML 元素。它使事件发生在元素“下面”上。

有关详细信息,请参阅:https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events

几乎所有浏览器都支持它,包括IE11;全球支持率在05/'21中约为98.2%):http://caniuse.com/#feat=pointer-events(感谢@s4y在评论中提供链接)。


答案 2

如果你只需要 mousedown,你可以通过以下方式使用 document.elementFromPoint 方法:

  1. 删除鼠标向下的顶层,
  2. 将 和 坐标从事件传递到方法,以获取下面的元素,然后xydocument.elementFromPoint
  3. 恢复顶层。