2011-08-10 9 views
5

Jeśli mam następujące znaczniki:jQuery metodą pozycja

<div id="parent" style="width: 300px; height: 300px;"> 
    <div id="child" style="position: relative; left: 0; top: 0; width: 100px; height: 100px;"></div> 
</div> 

i chcę, aby uzyskać pozycję dziecka w stosunku do jego rodzica, to jedynym sposobem jest następująca ?:

x = parseInt($('#child').css('left')); // returns 0 as needed 
y = parseInt($('#child').css('top')); // return 0 as needed 

Bo jeśli I wykonaj następujące czynności:

x = $('#child').position().left; // most likely will not return 0 
y = $('#child').position().top; // most likely will not return 0 

pozycja jest nie tak ze względu na fakt, że metoda działa offsetu lso dodać margines, dopełnienie i obramowanie dziadków (czy to element bryły z domyślnymi marginesami, czy jakikolwiek inny element dziadka).

Potrzebuję uzyskać właściwą pozycję (w moim przykładzie byłaby to 0, 0), ale podejrzewam, że nie ma metody w jQuery, które można obliczyć dla mnie?

+2

Uwaga: $ ("# child"). Css ("top") może dawać "auto", jeśli nie podano jawnie górnej. –

Odpowiedz

7

.position() jest poprawna. Da Ci to wartości x i y względem rodzica odsuniętego elementu. Twój element #child jest pozycjonowany względem jego własnego rodzica odsuniętego, czyli <body>. Aby uczynić #parent swojego rodzica z offsetu, należy mu nadać position z relative lub absolute.

<div id="parent" style="position: relative; width: 300px; height: 300px;"> 
    <div id="child" style="position: relative; left: 0; top: 0;...;"></div> 
</div> 
2

Metoda .position() pozwala nam pobrać aktualną pozycję elementu względem rodzica offsetowego. Porównaj to z .offset(), które pobiera aktualną pozycję względem dokumentu. Użyj .offset()

Powiązane problemy