How to grab the x, y position of html elements with javascript

dom, getelementbyid, html, javascript

Solution

Use `getBoundingClientRect`: http://ejohn.org/blog/getboundingclientrect-is-awesome/

For example:

var div = document.getElementById("yourDiv");
var rect = div.getBoundingClientRect();
alert("Coordinates: " + rect.left + "px, " + rect.top + "px");

Remember that `getBoundingClientRect` gives the coordinates relative to the current viewport, which means that if you want to know the coordinates relative to the `document.body`, you have to add the horizontal and vertical scroll amounts (`document.documentElement.scrollLeft` or `document.body.scrollLeft` for Firefox, and `.scrollTop` of course).

Problem

I have in my html document several div elements with certain css class and want to get x, y position of those elements, thanks in advance.

Original source