获取浮动元素在溢出div中的位置

Question

我有一个div（MainDiv），溢出和静态宽度和高度。这个div使用AJAX加载html内容。那些html是一个带有float：left CSS属性的多个div块，因此MainDiv可以左右滚动。每个块都具有相同的固定宽度

小例子：

<div id="MainDiv">
<div class="Block" style="float: left;" id="Block1">Content #1</div>
<div class="Block" style="float: left;" id="Block1">Content #2</div>
<div class="Block" style="float: left;" id="Block1">Content #3</div>
...
<div class="Block" style="float: left;" id="BlockN">Content #N</div>
</div>

如何使用jQuery获取相对于div.Block之一的MainDiv的位置？例如，我需要获得＃Block10相对于MainDiv的位置。

Answer 1

使用jQuery：

var pos = $('#Block10').offset();
$('#Block10').append('X=' + (pos.left - $('#MainDiv').offset().left) + '<br />');
$('#Block10').append('Y=' + (pos.top - $('#MainDiv').offset().top) + '<br />');