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

Question

我已经使用Pannellum构建了一个全景图，并在上面放置了一个图像。现在的问题是，鼠标和触摸事件被应用于图像，而不是到达全景查看器以控制它。我可以想象一个解决方案，首先放置一个透明的全景图，这样鼠标事件就可以控制它。然后将真正的pano放在下面，并将运动镜像到它上面。有没有更好的解决方案？我读过关于事件冒泡的文章，但还不理解它。

Answer 1

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

pointer-events: none;

只需将其添加到图像的style-tag即可。

在div中使用画布的示例：

HTML

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

CSS

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