2 个 HTML 画布相互堆叠，顶部对点击事件透明？答案

【问题标题】：2 HTML canvasses stacked on top of each other, with the top transparent to click events?2 个 HTML 画布相互堆叠，顶部对点击事件透明？
【发布时间】：2014-05-12 07:45:37
【问题描述】：

所以我正在构建一个小型 CAD 应用程序，我应该在其中也有一个网格。

网格必须位于所有元素之上。不幸的是，我实现 UNDO 功能的方式不允许我将网格合并到主画布中。

因此，我想到了将 2 个画布堆叠在一起。

顶部网格将是“网格画布”，仅用于绘制网格。
底部网格将是“主画布”，用于所有内容否则。

现在的问题是我可以很好地堆叠 2 个画布，但顶部画布阻止了主画布的点击事件。

有什么解决办法吗？

我使用Paper.js 作为库来创建应用程序。

【问题讨论】：

标签： canvas paperjs

【解决方案1】：

pointer-events:none

在您希望点击“传递”的元素上 https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events

【讨论】：

谢谢，我认为指针事件只会让它阻止鼠标事件。