Atrybut scrollX okna

Definicja i użycie

scrollX Atrybut zwraca liczbę pikseli przesuwających się z góry w lewym górnym rogu okna dokumentu.

scrollX Atrybut jest jedynie do odczytu.

Wskazówka

scrollX atrybut jest równy Atrybut pageXOffset atrybutu.

Dla kompatybilności przeglądarkowej, użyj window.pageXOffset Zamiast window.scrollX.

Zobacz również:

Atrybut pageXOffset

Atrybut pageYOffset

Przykład

Przykład 1

Przesuń zawartość o 100 pikseli w górę i w prawo, a także wyświetl scrollX i scrollY:

window.scrollBy(100, 100);
alert(window.scrollX + window.scrollY);

Spróbuj sam

Przykład 2

Utwórz trwałą nawigację:

// Pobierz pasek nawigacji
const navbar = document.getElementById("navbar");
// Pobierz pozycję offsetową paska nawigacji
const sticky = navbar.offsetTop;
// Dodaj klasę 'sticky' do paska nawigacji, gdy osiągasz jego pozycję przewijania. Usuń klasę 'sticky', gdy opuszczasz pozycję przewijania.
function myFunction() {
  if (window.scrollY >= sticky) {
    navbar.classList.add("sticky")
  } else {
    navbar.classList.remove("sticky");
  }
}

Spróbuj sam

Gramatyka

window.scrollX

Lub:

scrollX

Zwracana wartość

Typ Opis
Numer Liczba pikseli przesuwająca się z góry w lewym górnym rogu okna dokumentu.

Obsługa przeglądarek

Wszystkie przeglądarki wspierają window.scrollX:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Wspierane 9-11 Wspierane Wspierane Wspierane Wspierane