Come afferrare la posizione x, y degli elementi html con javascript

Question

Ho nel mio documento html diversi elementi div con determinate classi css e voglio ottenere x, y la posizione di questi elementi, grazie in anticipo.

Answer 1

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

Ad esempio:

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

Ricordate che getBoundingClientRect dà le coordinate relative alla finestra corrente, il che significa che se si vuole conoscere le coordinate relative al document.body, è necessario aggiungere gli importi di scorrimento orizzontale e verticale (document.documentElement.scrollLeft o document.body.scrollLeft per Firefox e .scrollTop ovviamente).

Answer 2

Se ho ben capito, si vuole fare questo http://www.quirksmode.org/js/findpos.html

Answer 3

Gli esempi mostrano soffietto come recuperare il ClientRect di 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 esso si accede alle destra, in alto, altezza, larghezza, sinistra e attributi in basso.