Fait défiler la page pour rendre l'élément visible à l'écran
Syntaxe element.scrollIntoView([conf])
Compatible tous navigateurs
Oui
Oui
Oui
Oui
Oui
Oui
Oui
Description Fait défiler la page pour rendre l'élément visible dans la page sur l'écran du navigateur.
Il existe des paramètres disponibles à la méthode mais ils ne sont pas encore compatibles avec tous les navigateurs. Dans le cas d'un navigateur incompatible avec les paramètres (comme Safari et Internet Explorer), ils seront ignorés.
Le paramètre facultatif conf est un objet comportant 3 propriétés : block détermine quelle partie de l'élément il faut afficher : "start" (par défaut), "center", "end" ou "nearest" behavior détermine la manière de défiler "auto" (par défaut) ou "smooth" (doux) inline détermine le comportement du scroll en mode horizontal (voir les valeurs de block)
Exemple 1 : Utilisation du scrollIntoView
Code source
<div class="btn btn-sm radius cursor-pointer color-white radius background-color-green" onclick="viewFooter()">Cliquez pour voir le pied de page</div>
<script type="text/javascript"> function viewFooter() { document.querySelector("div.tjs__footer").scrollIntoView({ block: "end", behavior: "smooth" });
}
</script>
Résultat
Cliquez pour voir le pied de page
Emulation de la console
Explication
Cliquez sur le bouton pour défiler vers le pied de page.
En savoir plus
