Why screenX and screenY are useless for getting mouse position

Related Ads

In Javascript, you may want to capture the current position of the mouse in response to a mouse event like click, mousedown, mouseovere, etc. If you go looking for this, you might think that the screenX and screenY attributes are the ones you want, but, unfortunately, they're not! These attributes give you the mouse position relative to the entire screen, not the page, and are pretty much useless. In Firefox, use the pageX and pageY attributes instead. In IE, you have to calculate it based on clientX and clientY, using the formula below:

x = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
y = e.clientY + document.body.scrollTop
 + document.documentElement.scrollTop;