element.scrollIntoView

La méthode Element.scrollIntoView() fait défiler la page de manière à rendre l'élément visible.

element.scrollIntoView();
element.scrollIntoView(alignToTop); // Paramètre booléen
element.scrollIntoView(scrollIntoViewOptions); // Paramètre d'objet

Paramètres

alignToTop Facultatif

est une valeur Boolean optionnelle qui :

• si elle vaut true (vrai), aligne l'élément avec le haut de la zone visible de l'ancêtre défilable. Correspond à scrollIntoViewOptions: {block: "start", inline: "nearest"}. C'est la valeur par défaut.
• Si elle vaut false (faux), celui-ci sera aligné en bas de la zone visible de l'ancêtre défilable. Correspond à scrollIntoViewOptions: {block: "end", inline: "nearest"}.

scrollIntoViewOptions Facultatif

Est un objet qui a les propriétés suivantes :

behavior Facultatif

Définit l'animation de transition qui peut être "auto", "instant" ou "smooth". Par défaut : "auto".

block Facultatif

L'une des options  "start", "center", "end" ou"nearest". Par défaut : "center".

inline Facultatif

L'une des options "start", "center", "end" ou "nearest". Par défaut : "nearest".

var element = document.getElementById("box");

element.scrollIntoView();
element.scrollIntoView(false);
element.scrollIntoView({block: "end"});
element.scrollIntoView({behavior: "smooth", block: "end", inline: "nearest"});

L'élément peut ne pas être aligné complètement avec le haut ou le bas, selon la disposition des autres éléments.

• Element.scrollIntoViewIfNeeded()