Proprietà scrollX della finestra

Definizione e uso

scrollX Proprietà restituisce il numero di pixel scollati dal lato sinistro superiore della finestra del documento.

scrollX Proprietà è readonly.

Suggerimento

scrollX Proprietà uguale a Proprietà pageXOffset proprietà.

Per la compatibilità tra browser, utilizzare window.pageXOffset Invece di window.scrollX.

Vedere anche:

Proprietà pageXOffset

Proprietà pageYOffset

Esempio

Esempio 1

Scorri il contenuto di 100 pixel e avvisa scrollX e scrollY:

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

Prova personalmente

Esempio 2

Creazione della barra di navigazione adesiva:

// Ottieni la barra di navigazione
const navbar = document.getElementById("navbar");
// Ottieni la posizione di scorrimento della barra di navigazione
const sticky = navbar.offsetTop;
// Aggiungi la classe sticky alla barra di navigazione quando raggiungi la posizione di scorrimento. Rimuovi la classe sticky quando esci dalla posizione di scorrimento.
function myFunction() {
  if (window.scrollY >= sticky) {
    navbar.classList.add("sticky")
  } else {
    navbar.classList.remove("sticky");
  }
}

Prova personalmente

Sintassi

window.scrollX

O

scrollX

Valore di ritorno

Tipo Descrizione
Numero Il numero di pixel scollati dal lato sinistro superiore della finestra.

Supporto del browser

Tutti i browser supportano window.scrollX:

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