javascript - 避免重叠元素中的事件

我有一个带有mousemove事件监听器的元素，这个元素与另一个元素重叠。当鼠标指针悬停在第二个元素上时，我希望监听器继续工作，这意味着我想避免与主要元素重叠的元素的鼠标事件，是否可能？

<body>
    <div style="position: relative">
        <canvas id="canvas" width="200" height="200" style="background-color: red">
        </canvas>
        <div style="width: 25px; height: 25px; background-color: blue; position: relative; top: -100px; left: 100px" />
    </div>
    <div id="coords"/>
    <script>
        var t = document.getElementById("coords");
        var c = document.getElementById("canvas");
        c.addEventListener("mousemove", function(event){
            t.innerText = "x: " + event.layerX + "; y: " + event.layerY;
        });
    </script>
</body>

避免重叠元素中的事件

0 个答案: