2014-01-19 3 views
1

저는이 사실을 인정하는 것보다 더 많은 시간 동안 고심하고 있습니다. jQuery Offset을 사용하여 페이지 아래에 몇 가지 요소를 배치하려고하지만 동일한 오프셋 값을 전달하더라도 렌더링 된 값은 화면에 크게 다릅니다.JQuery Offset은 2 개의 다른 결과를 반환합니다.

init: function (element, options) { 
    var that = this, 
    $field = $(element), 

    ... 

    var offset = $field.offset(); 
    that.ghostElement.offset({ top: offset.top, left: offset.left }); 
    that.suggestionsContainer.offset({ top: offset.top + $field.height(), left: offset.left }); 

을하지만,이 등과 같은 HTML을 렌더링 : 내 jQuery 코드는 다음과 같습니다

<span class="autosuggest-ghost" style="top: 48px; left: 30px;"></span> 

<div class="autosuggest-suggestions" style="top: 262px; left: 263.5px; display: block;">  
    <ul> 
     <li><a blah...</a></li> 
    </ul> 
</div> 

하나는 자동 제안 - 제안이 정상이 될 것이라고 생각 : 48 + 40, 왼쪽 30 만에 대한 거기에 더 큰 어떤 이유. 어떤 도움이라도 대단히 감사하겠습니다.

편집


하는 HTML 요소 바로 옆에 표시하고 그러나 다른 부모가없는 서로에 있습니다; autosuggest-ghost는 절대 위치를 가지고 있으며 autosuggest-suggestions는 절대 위치를가집니다. autosuggest-suggestions가 페이지의 다른 요소의 ontop을 플로팅해야하기 때문입니다.

+0

'offset()'은 창에 상대적입니다. 대신에'position()'을 찾고 싶지 않으십니까? – adeneo

+0

두 가지 요소가 정말로 당신의 질문에있는 방식으로 하나씩 이어 지나요? 아니면 실제 문서 구조가 다른가요? 나는 그들이 서로 다른 부모 요소를 가지고 있고'autosuggest-ghost'가 상대적으로 또는 절대적으로 위치 된 요소 내에 있다고 생각합니다. –

답변

0

offset()은 문서와 관련되어 있으므로 숫자는 정확하지만 이상한 방식으로 표현됩니다 ... 요소와 CSS를 어떻게 설정했는지에 따라 다릅니다. Position()은 부모 객체를 기준으로합니다. 하지만 CSS로 어떤 일이 벌어지고 있는지 완전히 모르는 경우에는 여전히 문제가 발생할 수 있습니다.

관련 문제