I develop a jQuery plugin for projection of 360° images, where the main means of interaction are mouse / touch dragging. The now community faces problems when images are inside an iframe, where it is relatively easy for the mouse pointer to slip out of the iframe “frame” while dragging the image, thus ceasing the frame-locked "mousemove" and "mouseup" events. DOM events simply don’t to bubble up across frames. Frequent unpleasant result is a stuck dragging (running inside jsFiddle‘s iframe-powered UI would be the best example).
To route around it, using $.unique( $(window).add(window.top) ) I bind to either [ window ] or [ window, window.top ] depending on the situation. And it works very well. If all on a same domain.
If the domains differ, Same Origin Policy will step up and prevent binding to the containing page causing security errors eventually failing the script all together.
So assuming the above, my question is: is there a way to listen to outside dragging events from an iframe cross-domain?
Failed attempts:
window.top.onmousemove =…window.top.addEventListener("mousemove"…$( window.top ).bind("mousemove"…
If instead of getting the end user to embed an iframe, you can get them to include a js script file, that you can then write the iframe from, and manage events in the realm of the parent document, in parallel to your iframe events. You can then potentially pass things back to the iframe via the server session (ie dynamically add in scripts to the current page which modify the users session, the changes being polled from within the iframe). Thats a completely not ideal situation… but it will get things to work, and gives you access to the parent environment. It gets messy over multiple embeds, but thats extra for experts i think.