element.offset 부모가 오버플로 및 테두리를 가질 때

Question

FF 및 IE는 오버플로 및 테두리가있는 부모로 자식이있을 때 offsetTop을 제공합니다. FF는 offsetTop 값에서 부모의 위쪽 테두리 크기를 빼서 음수 값을 반환합니다 (자주). IE가 올바른 값을 반환한다고 생각합니다.

Test it

같은 값을 얻을 수있는 crossbrowser의 방법은 무엇입니까?

감사합니다.

Answer 1

offsetTop 속성은 오프셋 부모에 상대적인 위치를 제공합니다. Fx와 IE의 차이점은이 경우 오프셋 부모와 다른 요소를 사용한다는 것입니다.

오버플로가이 문제에 어떻게 영향을 미치는지 정확히 알 수는 없지만 아직 정의에서 해당 항목을 찾지 못했습니다. 그러나 IE에 알려진 버그가 있는데, 오프셋 된 부모를 잘못 인식하게됩니다.이 버그는 여기에있는 변형 일 수 있습니다.

Answer 2

2005 년부터 공개 된 Firefox의 버그 인 것으로 보입니다.이 문제는 offsetTop에 대한 명확한 사양이없는 것으로 보입니다.

https://bugzilla.mozilla.org/show_bug.cgi?id=307502

getBoundingClientRect이 (나를 위해 않습니다) 작동 할 수 사용.

var rect; 
rect = el.getBoundingClientRect(); 
return rect.top;