Attribut scrollY de la fenêtre

Définition et utilisation

scrollY L'attribut retourne le nombre de pixels glissés du document depuis le coin supérieur gauche de la fenêtre.

scrollY L'attribut est lecture seule.

Indication

scrollY Attribut est égal à Attribut pageYOffset attribut.

Pour la compatibilité entre navigateurs, utilisez window.pageYOffset Plutôt que window.scrollY.

Veuillez également consulter :

Attribut pageXOffset

Attribut pageYOffset

Exemple

Exemple 1

Déplacez le contenu de 100 pixels et indiquez scrollX et scrollY :

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

Essayez-le vous-même

Exemple 2

Créer une navigation collante :

// Obtenez la barre de navigation
const navbar = document.getElementById("navbar");
// Obtenez la position d'offset de la barre de navigation
const sticky = navbar.offsetTop;
// Ajoutez la classe sticky à la barre de navigation lorsque vous atteignez sa position de défilement. Supprimez la classe sticky en quittant la position de défilement.
function myFunction() {
  if (window.scrollY >= sticky) {
    navbar.classList.add("sticky")
  } else {
    navbar.classList.remove("sticky");
  }
}

Essayez-le vous-même

Syntaxe

window.scrollY

Ou :

scrollY

Valeur de retour

Type Description
Numéro Nombre de pixels glissés depuis le coin supérieur gauche de la fenêtre du document.

Navigateur pris en charge

Tous les navigateurs le supportent window.scrollY：

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