触发具有较低Z索引值的DOM元素的事件

Triggering events for the DOM elements with lower Z-index value

本文关键字：索引值 DOM 元素 事件      更新时间：2023-09-26

有人能帮助我如何为z索引值较低的DOM元素触发事件吗。

//HTML代码

...
<div>
//Hihger Z-index element
<div id="element1" style="position: absolute;Z-index:5; height: 500px; width: 900px;"></div>    
//Lower Z-index element
<div id="element2" style="position: absolute;Z-index:2; height: 500px; width: 900px;"></div>  
</div>

//绑定事件

$("#element2").on("mouseenter",function() {alert("Problem with lower z-index")});

如果我为#element2设置了一个更高的Z索引值，则会触发该事件。

将指针事件：none添加到css代码#element1｛pointer-events:none；｝中，点击此处阅读更多信息。检查DEMO

CSS属性指针事件允许作者控制在什么情况下（如果有的话）特定的图形元素可以成为鼠标事件的目标。如果未指定此属性，则visiblePainted值的相同特性将应用于SVG内容。

  <div>
       //Hihger Z-index element
        <div id="element1" style="position: absolute;Z-index:5; height: 500px; width: 900px;pointer-events:none;"></div>    
     //Lower Z-index element
     <div id="element2" style="position: absolute;Z-index:2; height: 500px; width: 900px;"></div>  
 </div>
相关文章：