Przewijanie oknaX
Przykład 1
Przewiń zawartość o 100 pikseli i zaalarmuj scrollX i scrollY:
window.scrollBy(100, 100);
alert(window.scrollX + window.scrollY);
Więcej przykładów poniżej.
Definicja i użycie
Właściwość scrollX
zwraca piksele, które dokument przewinął z lewego górnego rogu okna.
Właściwość scrollX
jest tylko do odczytu.
Notatka
Nieruchomość scrollX
jest równa
pageXOffset
własności.
Aby zapewnić zgodność z różnymi przeglądarkami, użyj window.pageXOffset zamiast window.scrollX.
Zobacz też:
Składnia
window.scrollX
Lub tylko:
scrollX
Wartość zwrotu
Rodzaj | Opis |
Numer | Liczba pikseli, o jaką dokument przewinął się od lewego górnego rogu okna. |
Więcej przykładów
Utwórz lepki pasek nawigacyjny:
// 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.scrollY >= sticky) {
navbar.classList.add("sticky")
}
else {
navbar.classList.remove("sticky");
}
}
Obsługa przeglądarki
window.scrollX
jest obsługiwany we wszystkich przeglądarkach:
Chrome | IE | Edge | Firefox | Safari | Opera |
Yes | 9-11 | Yes | Yes | Yes | Yes |