获取元素相对于其父元素的距离

Question

我想知道如何获得元素相对于它的父元素的距离/偏移/位置.

与jQuery的position()功能不同,jQuery的功能是相对于父偏移位置的位置,我需要获得元素的(假设)稳定位置,因为它距离包含/父元素的顶部的距离.

例:

<div id="parent">
  <div id="pos1">Has a position of 0px from top of containing parent el.</div>
  <br style="height:20px;">
  <br style="height:20px;">
  <div id="pos2">Has a position of 40px from top of containing parent el.</div>
</div>

因此,无论父元素在文档中的位置如何,pos1并且pos2将报告相同的位置,因为它们相对于其父元素不会更改...

这可能吗？

Answer 1

这应该这样做:

$('#pos1').offset().top - $('#pos1').parent().offset().top - $('#pos1').parent().scrollTop() 

Answer 2

这段代码适合我.

var child_top = $("#parent_div").scrollTop() + $("#child_div").offset().top