jQuery x y document coordinates of DOM object

Question

I need to get the X,Y coordinates (relative to the document\'s top/left) for a DOM element. I can\'t locate any plugins or jQuery property or method that can give these to

Answer 1

you can use Dimensions plugin [Deprecated... included in jQuery 1.3.2+]

offset()
Get the current offset of the first matched element, in pixels, relative to the document.

position()
Gets the top and left position of an element relative to its offset parent.

knowing this, then it's easy... (using my little svg project as an example page)

var x = $("#wrapper2").offset().left;
var y = $("#wrapper2").offset().top;

console.log('x: ' + x + ' y: ' + y);

output:

x: 53 y: 177

hope it helps what you're looking for.

here's an image of offset() and position()

using XRay

using Web Developer toolbar