事件监听器处理堆叠/重叠的画布元素

Eventlistener handling on stacked/overlapped canvas elements

本文关键字：布元素 元素 重叠 处理 监听器 事件      更新时间：2023-09-26

我有3个重叠的画布，它们在一个div (canvasContainer)中。div包含一些事件监听器，第一个画布也是如此。我希望最后一个画布是在3画布的顶部，但仍然听取第一个画布的事件。我不想使用z-index参数

<canvas width="512" height="512" id="canvasXTKP" style="position: absolute; display: block; opacity: 0.8; width: 100%; height: 100%; cursor:        default;"></canvas>
<canvas width="512" height="512" id="imageView" numcanvas="15" style="overflow: visible; position: absolute;"></canvas>
<canvas width="512" height="512" id="imageTemp" style="z-index: 10; overflow: visible; position: absolute; cursor: auto;"></canvas>

你可以在2画布上使用CSS属性pointer-events，它不应该监听事件，就像这样:

pointer-events: none;
相关文章：