javascript - Javascript，Pannellum：覆盖图像捕获鼠标/触摸事件

Question

我使用 Pannellum 构建了一张全景图，并在其上方放置了一张图像。现在的问题是鼠标和触摸事件被应用于图像并且没有到达全景查看器以控制它。我可以想象一个解决方案，将透明全景放在首位，以便鼠标事件控制它。然后将真正的全景放在所有下方并将动作镜像到它。有更好的解决方案吗？我读过关于事件冒泡的文章，但还不明白。

Answer 1

您可以使用 css 选项禁用与图像的交互

pointer-events: none;

只需将其添加到图像的样式标签中即可。

div中的画布示例：

HTML

<div id="crosshairCont"><canvas id="crosshair" height="450px" width="800px"></canvas></div> 

CSS

#crosshairCont{
 z-index: 2;
 position: absolute;
 pointer-events: none;
}