The Setup
I have an embedded flash player set to fit the page (100%).
Stretched over the whole page is a 1x1px transparent gif, to avoid people from clicking/focusing the player.
Dimensions of the visible part in this player can be read out via Javascript. Combined with "window.innerheight" + "window.innerwidth" and the mouse position in pixels mapping calculations are performed.
The Problem
This works good and great as long as the webpage is viewed at 100% zoom level. With different zoom levels, "window.innerheight" and "innerwidth" will adapt to the scaled pixels, but the player retains its original dimension values. This leads to wrong mapping.
References
My search through stackoverlow gave various references to zoom level detection, the most elaborate being: How to detect page zoom level in all modern browsers?.
It seems like there are a lot of different ways that need to be implemented to cover all browsers though even then it's kind of hard to grasp which of those things still work and which don't.
As for how to change the zoom level I mainly stumble across code similar to: Disable zooming of the page in desktop web browsers using Javascript/Jquery
Though, here as well the answer might be outdated.
Question
So far I had no luck implementing a suitable solution based on these. Being a novice to Javascript it would be nice to clarify if it's my lack of knowledge or if I am working with outdated references.