Problem with two canvases

CesiumJS
1

I have a question about placing two canvases on the screen. In HTML, I declared two containers, cesiumContainerTop and cesiumContainerBottom, to hold the two viewers. The top container takes up the top 50% of the screen and the bottom takes up the bottom 50% of the screen. After, I declared two viewers, viewerTop and viewerBottom, and set up a handler for each that will execute at MOUSE_MOVE.

A problem that I noticed is that when I am hovering over the top div, it tells me that I am hovering over both the top viewer and the bottom viewer. How is this possible if they're located in separate divs? And to make the problem worse, because I am 'hovering' over both viewers, it is executing both handlers (which I do not want).

Has anybody else noticed this? Is there a solution?

Thanks,
Lydia

2

I have an old Sandcastle example of two widgets posted at https://gist.github.com/mramato/6581488

I haven’t tried it in a while, but it should work. Can you see if you are still getting the problem with this example? It sounds like the issue may be with the HTML of your app. If you have a working URL for your app, we can take a look at that as well.