如何在可滚动的div中获取对象的相对位置？

Question

我有一个可滚动的div，上图中左边的那个。
在这个div中有许多元素，让我们专注于其中一个（以灰色突出显示）并将其称为A.

右图是具有完整尺寸（没有滚动或宽度设置）的div的表示，其中放置A而不滚动。

当我在页面上显示左侧div时，如何找到X的值（绿色）。
即考虑到：

1. 页面上的div已调整大小
2. 页面上的div是可滚动的（并已滚动）
3. 我想x不是y！

即。如何在可滚动div中获取元素的相对y坐标？ 用简单的话说：如何通过javascript计算x？

Answer 1

试试这个：

var elementTop = document.getElementById('yourElementId').offsetTop;
var divTop = document.getElementById('yourDivId').offsetTop;
var elementRelativeTop = elementTop - divTop;

Answer 2

您需要将父级的div位置属性指定为相对属性，然后使用position（）方法（如果您使用的是jquery）。

请检查：http://jsfiddle.net/V9rGG/

尝试删除 position: relative 看看会发生什么。