Javascript, Pannellum: оверлейное изображение захватывает события мыши / касания

Question

Я построил панораму, используя Паннеллум, и разместил над ней изображение. Теперь проблема в том, что события мыши и касания применяются к изображению и не достигают средства просмотра панорамы, чтобы управлять им. Я могу представить решение, разместив прозрачную панораму над всем, чтобы события мыши управляли ею. Затем поместите настоящую панораму ниже всех и отразите движения к ней. Есть ли лучшее решение? Я читал о событиях, но пока не понял.

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;
}