คุณสมบัติ offsetTop
คุณสมบัติ offsetTop ประกอบด้วยการเลื่อน
ขององค์ประกอบจากด้านบนเทียบกับ offsetParent
ประกอบด้วยระยะห่างจาก offsetParent ถึงขอบ
ขององค์ประกอบ
ไวยากรณ์
องค์ประกอบ.offsetTop;
ตัวอย่าง
ลองหาการเลื่อนขององค์ประกอบเทียบกับ
offsetParent ของมัน:
<div id="parent" style="position: relative;">
<div id="elem" style="position: absolute; top: 100px;"></div>
</div>
let elem = document.querySelector('#elem');
console.log(elem.offsetTop);
ผลลัพธ์จากการรันโค้ด:
100
ตัวอย่าง
ระยะห่าง margin
จะถูกรวมเข้าไปในการเลื่อนด้วย:
<div id="parent" style="position: relative;">
<div id="elem" style="position: absolute; top: 100px; margin: 50px;"></div>
</div>
let elem = document.querySelector('#elem');
console.log(elem.offsetTop);
ผลลัพธ์จากการรันโค้ด:
150
ดูเพิ่มเติม
-
คุณสมบัติ
offsetLeft,
ซึ่งประกอบด้วยการเลื่อนขององค์ประกอบจากด้านซ้าย -
เมธอด
getBoundingClientRect,
ซึ่งค้นหาการเลื่อนขององค์ประกอบ
