offsetTop
Misol
"myDIV" elementining offsetTop joylashuvini oling:
const element = document.getElementById("myDIV");
let pos = element.offsetTop;
O‘zingiz sinab ko‘ring »
"myDIV" elementining joylashuvlarini oling:
const element = document.getElementById("test");
Let pos1 = element.offsetTop;
let pos2 = element.offsetLeft;
O‘zingiz sinab ko‘ring »
Quyida ko‘proq misollar.
Tavsif
offsetTop xususiyati ota elementga nisbatan yuqori joylashuvni (pikselda) qaytaradi.
Qaytariladigan qiymat quyidagilarni o‘z ichiga oladi:
- elementning yuqori joylashuvi va tashqi bo‘shlig‘i (margin)
- ota elementning yuqori ichki bo‘shlig‘i (padding), aylantirish paneli (scrollbar) va chegarasi (border)
offsetTop xususiyati faqat o‘qish uchun.
Darslik:
offsetParent
Barcha blok darajasidagi elementlar o‘z siljishlarini (offset) offset ota elementiga nisbatan hisoblaydi:
- offsetTop
- offsetLeft
- offsetWidth
- offsetHeight
Offset ota element — position qiymati static’dan farqli bo‘lgan eng yaqin ajdod element.
Agar offset ota element mavjud bo‘lmasa, siljish hujjat tanasiga (body) nisbatan hisoblanadi.
Shuningdek qarang:
Sintaksis
Yuqori siljish (offset) joylashuvini qaytarish:
element.offsetTop
Qaytariladigan qiymat
| Tip | Tavsif |
| Number | Elementning yuqori joylashuvi, pikselda. |
Ko‘proq misollar
Yopishqoq (sticky) navigatsiya panelini yarating:
// Get the navbar
const navbar = document.getElementById("navbar");
// Get the offset position of the navbar
const sticky = navbar.offsetTop;
// Add the sticky class to the navbar when you reach its scroll position. Remove the sticky class when you leave the scroll position.
function myFunction() {
if (window.pageYOffset >= sticky) {
navbar.classList.add("sticky")
} else {
navbar.classList.remove("sticky");
}
}
O‘zingiz sinab ko‘ring »
Brauzerlarda qo‘llab-quvvatlash
element.offsetTop barcha brauzerlarda qo‘llab-quvvatlanadi:
| Chrome | Edge | Firefox | Safari | Opera | IE |
| Ha | Ha | Ha | Ha | Ha | Ha |
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!