jquery - 親 div (jquery) に対して相対的な div の下のピクセル数を見つける方法

Question

例を挙げると、child3 が親から何ピクセル下にあるかを調べるにはどうすればよいでしょうか?

<div class="parent" id="unique"> 
<div class="child1"></div>
<div class="child2"></div>
<div class="child3"></div>
<div class="child4"></div>
</div>

クラスが幅、高さ、パディング、マージンなどを定義すると仮定します

Answer 1

var child=$('.child3');
var parent=$('.parent');

return child.offset().top-parent.offset().top;

Offsetドキュメントに対する要素の位置を定義します。

Answer 2

使用できます.offset()：

var $child = $('.child3');
var offset = $child.parent().offset().top - $child.offset().top;

境界線と余白が考慮されているかどうかはよくわかりませんが、それらを説明するのは難しくありません。

Answer 3

あなたが探しているのはposition()機能だと思います。topとの値を含むオブジェクトを返しleftます。

説明: 一致した要素のセット内の最初の要素の現在の座標を、オフセットの親を基準にして取得します。

のドキュメントposition()