Retourner à la page d'accueil de TJS

Méthode : HTMLElement.scrollIntoView()

Fait défiler la page pour rendre l'élément visible

Syntaxe
element.scrollIntoView([param])

Compatibilité navigateurs

Description
Fait défiler la page pour rendre l'élément visible dans la page.
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), ils seront ignorés.

Le paramètre 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.

Page en rapport
Introduction au DHTML
Page mise à jour le

Mon nouveau livre Tout JavaScript chez Dunod

Tout JavaScript le livre chez DunodEn savoir plus
Sortie le 14 novembre 2019

Version papier à 29€90
Format électronique à 22€99.

Commandez en ligne

Chercher une fonction, un objet, ...

Le graph des objets Javascript



Chargement
en cours...
Le 09/04/2020 17:26:01 sur php7 en 28.26 ms