jQuery x y współrzędne dokumentu obiektu DOM

Question

Potrzebuję uzyskać współrzędne X, Y (względem góry/lewej strony dokumentu) dla elementu DOM. Nie mogę zlokalizować żadnych wtyczek ani właściwości lub metody jQuery, które mogą mi je przekazać. Mogę uzyskać górny i lewy element DOM, ale może to być względne w stosunku do bieżącego kontenera/rodzica lub do dokumentu.

Answer 1

można użyć Dimensions wtyczki [przestarzałe ... zawarte w jQuery 1.3.2 i nowsze]

offsetu()
Get prąd przesunięcia pierwszego dopasowanego elementu w pikselach względem dokumentu .

pozycji()
pobiera górną i lewe położenie elementu w stosunku do jego przesunięcia rodzica.

wiedząc o tym, czym jest to łatwe ... (używając mojego trochę svg project w postaci example page)

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

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

wyjście:

x: 53 y: 177 

nadzieję, że pomoże to, czego szukasz.

oto obraz offsetu() i pozycja()

użyciu XRay

użyciu Web Developer pasek

Answer 2

offset funkcja zrobi to za Ciebie.

Oto przykład dają:

var p = $("p:last"); 
var offset = p.offset(); 
p.html("left: " + offset.left + ", top: " + offset.top); 

Answer 3

Moje rozwiązanie jest plugin z "obejścia": + D. Ale działa!

jQuery.fn.getPos = function(){ 
     var o = this[0]; 
     var left = 0, top = 0, parentNode = null, offsetParent = null; 
     offsetParent = o.offsetParent; 
     var original = o; 
     var el = o; 
     while (el.parentNode != null) { 
      el = el.parentNode; 
      if (el.offsetParent != null) { 
       var considerScroll = true; 
       if (window.opera) { 
        if (el == original.parentNode || el.nodeName == "TR") { 
         considerScroll = false; 
        } 
       } 
       if (considerScroll) { 
        if (el.scrollTop && el.scrollTop > 0) { 
         top -= el.scrollTop; 
        } 
        if (el.scrollLeft && el.scrollLeft > 0) { 
         left -= el.scrollLeft; 
        } 
       } 
      }    
      if (el == offsetParent) { 
       left += o.offsetLeft; 
       if (el.clientLeft && el.nodeName != "TABLE") { 
        left += el.clientLeft; 
       } 
       top += o.offsetTop; 
       if (el.clientTop && el.nodeName != "TABLE") { 
        top += el.clientTop; 
       } 
       o = el; 
       if (o.offsetParent == null) { 
        if (o.offsetLeft) { 
         left += o.offsetLeft; 
        } 
        if (o.offsetTop) { 
         top += o.offsetTop; 
        } 
       } 
       offsetParent = o.offsetParent; 
      } 
     } 
     return { 
      left: left, 
      top: top 
     }; 
    }; 

Zastosowanie:

var p = $("#wrapper2").getPos(); 
alert("top:"+p.top+"; left:"+p.left);