JavaScript
jQuery

【 javascript / jQuery 】offsetTopとoffset().top


element.offsetTop

親からの相対的位置。


offsetTop は、その要素の offsetParent ノードの上端からの相対的な位置を返します。


javascript

element.offsetTop;

jQuery

$(element).position().top


offset().top

documentからみた位置。

javascript

const $element = document.getElementById("element");

const rect = $element.getBoundingClientRect();
const scrollTop = window.pageYOffset || document.documentElement.scrollTop;

rect.top + scrollTop; // offset().top;

参考:https://q-az.net/without-jquery-height-width-offset-scrolltop/

jQuery

$(element).offset().top;

jQueryって楽だけど

バニラはちゃんと中身を見てる感がいい。