scrollTop
Misol
"myDIV" elementining tarkibi necha piksel aylantirilganini oling:
const element = document.getElementById("myDIV");
let x = elmnt.scrollLeft;
let y = elmnt.scrollTop;
O‘zingiz sinab ko‘ring »
"myDIV" tarkibini gorizontal bo‘yicha 50 piksel va vertikal bo‘yicha 10 piksel POZITSIYAGACHA aylantiring:
const element = document.getElementById("myDIV");
element.scrollLeft = 50;
element.scrollTop = 10;
O‘zingiz sinab ko‘ring »
"myDIV" tarkibini gorizontal bo‘yicha 50 piksel va vertikal bo‘yicha 10 piksel MASOFAGA aylantiring:
const element = document.getElementById("myDIV");
element.scrollLeft += 50;
element.scrollTop += 10;
O‘zingiz sinab ko‘ring »
Quyida ko‘proq misollar.
Tavsif
scrollTop xususiyati element tarkibi vertikal bo‘yicha necha piksel aylantirilganini o‘rnatadi yoki qaytaradi.
Sintaksis
scrollTop xususiyatini qaytarish:
element.scrollTop
scrollTop xususiyatini o‘rnatish:
element.scrollTop = pixels
Xususiyat qiymatlari
| Qiymat | Tavsif |
| pixels | Element tarkibi vertikal bo‘yicha aylantirilgan piksellar soni. Agar son manfiy bo‘lsa, u 0 ga o‘rnatiladi. Agar elementni aylantirib bo‘lmasa, son 0 ga o‘rnatiladi. Agar son ruxsat etilgan maksimumdan katta bo‘lsa, u maksimal qiymatga o‘rnatiladi. |
Qaytariladigan qiymat
| Tip | Tavsif |
| Number | Element tarkibi vertikal bo‘yicha aylantirilgan piksellar soni. |
Ko‘proq misollar
Misol
<body> tarkibini gorizontal bo‘yicha 30 piksel va vertikal bo‘yicha 10 piksel aylantiring:
const html = document.documentElement;
html.scrollLeft += 30;
html.scrollTop += 10;
O‘zingiz sinab ko‘ring »
Misol
Turli aylantirish holatlarida klass nomlarini almashtirish — foydalanuvchi sahifani yuqoridan 50 piksel pastga aylantirganda elementga "test" klass nomi qo‘shiladi (yana yuqoriga aylantirilganda esa olib tashlanadi):
window.onscroll = function() {myFunction()};
function myFunction() {
if (document.body.scrollTop > 50 || document.documentElement.scrollTop > 50) {
document.getElementById("myP").className = "test";
} else {
document.getElementById("myP").className = "";
}
}
O‘zingiz sinab ko‘ring »
Misol
Foydalanuvchi sahifani yuqoridan 350 piksel pastga aylantirganda elementni siljitib chiqaring (slideUp klassini qo‘shing):
window.onscroll = function() {myFunction()};
function myFunction() {
if (document.body.scrollTop > 350 || document.documentElement.scrollTop > 350) {
document.getElementById("myImg").className = "slideUp";
}
}
O‘zingiz sinab ko‘ring »
Brauzerlarda qo‘llab-quvvatlash
element.scrollTop barcha brauzerlarda qo‘llab-quvvatlanadi:
| Chrome | Edge | Firefox | Safari | Opera | IE |
| Ha | Ha | Ha | Ha | Ha | Ha |
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!