How to get the "absolute" position of an html element

Question

Hi guys, I have some elements positioned via CSS this way:

#myItem{
position: absolute;
left: 50%;
margin-left: -350px;
}

I'd like to get their distance from top and left margin of the page. How can I get those measure with javascript/jquery?

Thanks

Answer 1

Take a look at jQuery's

.position()

and

.offset()

EDIT: As mentioned by @Nick, .offset() is what you want if you need the position relative to the document

$("#myItem").offset().top;

Answer 2

You can use .offset() for this:

var offset = $("#myItem").offset();
//use offset.left, offset.top

You can give it a try here.