获得浮动元素的位置

Question

我有一些像这样的代码:

<style>
.box {
    width: 100px;
    height: 100px;
    margin: 10px;
    background: green;
    border: 1px solid black;
    float: left;

}

#wrapper {
    position: relative;
}
</style>


<div id="wrapper">
<div class="box">1</div>
<div class="box">2</div>
<div class="box">3</div>
<div class="box">4</div>
<div class="box">5</div>
<div class="box">6</div>
</div>

我需要得到相对于#wrapper的每个框的左上角.我试图通过jQuery.position()来做到这一点,但是,我没有得到正确的结果.继续获得0,0.任何人都可以.我认为这里的问题是花车......如果它们绝对定位,我会正确阅读它们.

Answer 1

这里有一些jQuery代码会提醒左侧位置.这适用于浮井.

$(function() {
    $('#wrapper div').each( function( index, item ) {
            alert( $(this).position().left);
    });
});

这里有一个jsFiddle:http://jsfiddle.net/ytGYS/

Answer 2

位置实际上工作得很好，只需确保你明确修复你的#wrapper，使其具有高度和宽度。您遇到的问题是，当所有元素都浮动时，您的父级 #wrapper 会折叠并且没有尺寸，因此 jQuery 无法计算出一个元素与另一个元素之间的距离。