I\'m trying to get the screen coordinates (that is, relative to the top left corner of the screen) of an element in a browser window. It\'s easy to get the size and position
I disagree with jvenema's answer.
I have found a solution that is working for me on google chrome anyway, but I hope that this will works on many other browsers too (maybe not on some old internet explorers).
Inside the tags declare new two global variables called: pageX and pageY with the
var
keyword.
These global variables should always store the coordinates of the top left corner of the rendered page relative to the top left corner of the screen monitor, but in order to achieve this goal, the window.onmousemove
should refers to a function that sets the pageX to the difference of event.screenX and event.clientX, and the pageY to the difference of event.screenY and event.clientY.
Then all what you need to do is to get the coordinates of an element (relative to the top left corner of the rendered page) and add pageX and pageY. The results of these expressions will be the coordinates of this element relative to the top left corner of the screen monitor!
Code example (only javascript):
Hope that helps!