2008-10-17 21 views

cevap

32

Her ikisinde de yapabilirsiniz - belgeye göre konumu alın ve kaydırma konumunu çıkarın.

var e = document.getElementById('xxx'); 
var offset = {x:0,y:0}; 
while (e) 
{ 
    offset.x += e.offsetLeft; 
    offset.y += e.offsetTop; 
    e = e.offsetParent; 
} 

if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) 
{ 
    offset.x -= document.documentElement.scrollLeft; 
    offset.y -= document.documentElement.scrollTop; 
} 
else if (document.body && (document.body.scrollTop || document.body.scrollLeft)) 
{ 
    offset.x -= document.body.scrollLeft; 
    offset.y -= document.body.scrollTop; 
} 
else if (window.pageXOffset || window.pageYOffset) 
{ 
    offset.x -= window.pageXOffset; 
    offset.y -= window.pageYOffset; 
} 

alert(offset.x + '\n' + offset.y); 
+1

Lütfen "position" öğesini "offset" ve "bodt" ile "body" ile değiştirin. – suzanshakya

+3

hats-off ... bunu yazan kişi. – Varun

+0

mükemmel - teşekkürler! – Iamsamstimpson

0

Sen ancak çok basit bir sayfada, document.body.scrollTop

Bu IE7 ve FF3 üzerinde çalışmak gibi görünüyor dan div offsetTop çıkarma olabilir. Yuvalanmış DIV'leri kontrol etmedim.

+0

Hayır, offsetTop sadece üst div içindeki konumunuzu gösterir. Bu, üst düzey div için çalışır ve başkalarıyla başarısız olur. İlk cevabın ebeveynleri ofsetleri biriktirerek nasıl yürüdüğünü not edin. – mmaclaurin

0

Prototip kullanarak olurdu:

IE ve Firefox 3'te
$('divname').viewportOffset.top 
$('divname').viewportOffset.left 
3

, bunun için getBoundingClientRect kullanabilirsiniz; çerçeve gerekli değildir.

Ancak, diğer tarayıcıları da desteklemeniz gerekiyorsa, bir çerçeve kullanmalısınız.

6

yerli getBoundingClientRect() yöntem artık uzunca bir süredir ve soru sorar tam olarak ne yapar gelmiştir [cevap yapıştırılıyor ben here verdi]. Artı tüm tarayıcılarda desteklenir (IE 5 dahil, öyle görünüyor!)

this MDN sayfasından:

döndürülen değer salt okunur sol içeren bir TextRectangle nesnesidir, üst, sağ ve alt numaralı görünümün sol üst köşesine göre üst soldaki numaralı piksel ile sınır kutusunu açıklayan özellikler.

Öyle gibi kullanabilirsiniz:

var viewportOffset = el.getBoundingClientRect(); 
// these are relative to the viewport, i.e. the window 
var top = viewportOffset.top; 
var left = viewportOffset.left; 
İlgili konular