나는 몇 가지 코드를 다음과 같이이 float 된 요소

Question

의 위치가 점점 : 나는 #wrapper을 기준으로 왼쪽, 각 상자의 상단을 얻을 필요가

<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> 

합니다. 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

가 여기에 귀하의 마크 업을 가진 바이올린과 코드 예제 : http://jsfiddle.net/tBwwr/

Answer 3

위치가 실제로 잘 작동, 단지 당신이 있도록 #wrapper를 clearfix 수 있도록 그 높이와 너비가 있습니다. 당신이 가진 문제는 모든 엘리먼트가 떠 다니면서 부모 # 래퍼가 붕괴되고 치수가 없기 때문에 jQuery는 한 객체가 다른 객체와 얼마나 멀리 떨어져 있는지 알 수 없다는 것입니다.

Answer 4

+1 andrewheins 대답 :

당신은 완전히 맞습니다. #wrapper가 너무 작아 서로 떠있는 요소를 모두 표시 할 수 없으면 $(). offset()은 서로의 위치를 ​​나타냅니다.

귀찮은 것은 # 래퍼가 올바른 너비에 도달하기 전에 $(). offset()이 선택되었을 때입니다. 예를 들어, 두 개의 $ (document) .ready() 함수가 잘못된 순서로 실행되면. (먼저 get offset()을 얻고 너비를 설정하십시오)

참고 : 답변을 투표하거나 의견을 남기려면 평판이 충분하지 않습니다.