Cómo captar la posición x, y de los elementos html con javascript

Question

Tengo en mi documento html varios elementos div con cierta clase CSS y quiero obtener la posición x, y de esos elementos, gracias de antemano.

Answer 1

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

Por ejemplo:

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

Recuerde que getBoundingClientRect da las coordenadas relativos a la ventana gráfica actual, lo que significa que si usted quiere saber las coordenadas relativas a la document.body, tiene que agregar las cantidades de desplazamiento horizontal y vertical (document.documentElement.scrollLeft o document.body.scrollLeft para Firefox, y .scrollTop por supuesto).

Answer 2

Si entiendo, que desea hacer esto http://www.quirksmode.org/js/findpos.html

Answer 3

Los ejemplos muestran abajo cómo recuperar la ClientRect de un elemento HTML

# first tag link of this page 
document.getElementsByClassName('post-taglist')[0].children[0].getClientRects()[0] 
# question div 
document.getElementById('question').getClientRects()[0] 

Con ella se tiene acceso a derecha, de arriba, la altura, ancho, atributos izquierdo y fondo.