HTML elements blocking PC mouse detection

Help & Support
#1

I’ve ran into this before but was always able to kinda work around it. But in this case…

I have a canvas floating above the Playcanvas canvas. The Playcanvas camera is controlled by OrbitCamera. If I drag the mouse through the floating canvas the orbit camera doesn’t detect the mouse until I drag out of the floating canvas. I’ve seen this happen with other html elements like divs, etc.

Tried to stop propagation on the floating canvas. Tried stuff like pointer-events: none; user-select: none in css but no luck.

Seems like this problem is because pc.Mouse is using the canvas, not the window. If I try to put window in there it blows up. (although I can put window in for the pc.Touch)

You guys know anyway to fix this?

Joe H.

#2

Hi @jhinrichs,

Using pointer-events:none; is what usually solves this type of issue for me, not sure if a specific arrangement breaks this in your case.

Can you provide a sample project that reproduces this issue to take a look?

1 Like