jQuery에서 부모와 관련된 offset ()을 얻는 방법은 무엇입니까?

jQuery에서 부모와 관련된 offset ()을 얻는 방법은 무엇입니까?

---

이것은 주 창의 왼쪽 가장자리에서 일부 요소의 위치를 ​​제공합니다.

$('#bar').offset().left;

해당 요소가 다른 요소 내부에 있고 #foo (부모)에 상대적인 #bar의 위치를 ​​원하면 어떻게 얻을 수 있습니까?

<style>
#foo { width: 200px; margin: 0 auto; }
#foo #bar { width: 50px; margin: 0 auto; }
</style>

<div id="foo">
   <span id="bar"></span>
</div>

라는 함수가있는 것을 보았지만 offsetParent()콘솔이 로그되었을 때이 함수에 leftor 라는 속성이없는 것 같습니다 x. 그래서 내가 필요한 것을 얻는 데 사용할 수 있는지 확실하지 않습니다.

따라서 위의 예에서 오프셋은 기본 창 가장자리에서 수천 픽셀이 아닌 부모 가장자리에서 약 125px이어야합니다.

---

position () 메서드를 사용하십시오.

$('#bar').position().left;

---

간단합니다. 요소의 오프셋을 얻고 부모의 오프셋을 뺍니다.

var elem = $("#bar");
var offset = elem.offset().left - elem.parent().offset().left;

---

부모를 기준으로 div 내 위치 :

제 경우에는 스크롤이 계산 된 오프셋을 변경했을 때도 변경되어서는 안되므로 어쨌든 더 빠른 순수 자바 스크립트를 사용하게되었습니다.

element.get (0) .offsetTop

Left와 같은 다른 변형도 가능합니다 element.get (0) .offsetLeft

결론

element.offset (). top 또는 position ()은 위치 관련 사례에 최적이 아닙니다.

---

offsetLeft = $('#bar').position().left;
offsetTop = $('#bar').position().top;

참조 URL : https://stackoverflow.com/questions/10954931/how-to-get-offset-relative-to-parent-in-jquery