요소의 올바른 오프셋을 얻는 방법? -jQuery

이것은 아마도 정말 간단한 질문이지만 jQuery에서 요소 의 올바른 오프셋을 얻으려면 어떻게해야 합니까?

내가 할 수있는:

$("#whatever").offset().left;

그리고 그것은 유효합니다.

그러나 다음과 같이 보입니다.

$("#whatever").offset().right 

정의되지 않았습니다.

그렇다면 jQuery에서 이것을 어떻게 수행합니까?

감사!!

Alex, Gary :

요청에 따라 답변으로 게시 된 내 의견은 다음과 같습니다.

var rt = ($(window).width() - ($whatever.offset().left + $whatever.outerWidth()));

알려 줘서 고마워.

다음과 같이 표현할 수있는 의사 코드에서 :

오른쪽 오프셋은 다음과 같습니다.

창의 너비 MINUS
(요소의 왼쪽 오프셋 에 요소의 외부 너비를 더한 값 )

var $whatever        = $('#whatever');
var ending_right     = ($(window).width() - ($whatever.offset().left + $whatever.outerWidth()));

참조 : .outerWidth ()

아마도 귀하의 질문을 오해하고 있지만 오프셋은 수평 및 수직의 두 가지 변수를 제공해야합니다. 이것은 요소의 위치를 ​​정의합니다. 그래서 당신이 찾고있는 것은 :

$("#whatever").offset().left

과

$("#whatever").offset().top

요소의 올바른 경계가 어디에 있는지 알아야하는 경우 다음을 사용해야합니다.

$("#whatever").offset().left + $("#whatever").outerWidth()

Greg가 말한 내용에 추가하면 다음과 같습니다.

$ ( "# whatever"). offset (). left + $ ( "# whatever"). outerWidth ()

이 코드는 왼쪽에 상대적인 올바른 위치를 가져옵니다. 의도가 오른쪽에 상대적인 오른쪽 위치를 가져 오려는 경우 (예 : CSS right속성을 사용할 때 ) 다음과 같이 코드에 추가해야합니다.

$ ( "# parent_container"). innerWidth ()-($ ( "# whatever"). offset (). left + $ ( "# whatever"). outerWidth ())

이 코드는 rightCSS 에서 속성을 처음 설정할 수 없을 때 오른쪽을 고정 앵커로 설정해야하는 애니메이션에서 유용합니다 .

실제로 이것은 창이 왼쪽 상단 위치에서 전혀 스크롤되지 않은 경우에만 작동합니다.
페이지에 유지되도록 요소 위치를 변경하는 데 유용한 오프셋을 얻으려면 창 스크롤 값을 빼야합니다.

var offset = $('#whatever').offset();

offset.right = ($(window).width() + $(window).scrollLeft()) - (offset.left + $('#whatever').outerWidth(true));
offset.bottom = ($(window).height() + $(window).scrollTop()) - (offset.top + $('#whatever').outerHeight(true));

이 작업을 즉시 수행하는 기본 DOM API가 있습니다. — getBoundingClientRect:

document.querySelector("#whatever").getBoundingClientRect().right

Brendon Crawford가 여기에서 가장 좋은 답변을 얻었으므로 (코멘트에서) 그가 할 때까지 답변으로 옮기겠습니다 (그리고 조금 확장 할 수도 있습니다).

var offset = $('#whatever').offset();

offset.right = $(window).width() - (offset.left + $('#whatever').outerWidth(true));
offset.bottom = $(window).height() - (offset.top + $('#whatever').outerHeight(true));

a의 앵커 포인트 얻기 div/table (left) = $("#whatever").offset().left;-좋아요!

앵커 포인트를 얻으려면 div/table (right)아래 코드를 사용할 수 있습니다.

 $("#whatever").width();