Metoda pro scrollování okna k elementu v JavaScriptu

Metoda scrollIntoView scrolluje okno k zadanému elementu. Metoda se aplikuje na element, ke kterému se má scrollovat okno. Parametrem metody se reguluje, kde se má element ocitnout: nahoře v okně nebo dole.

Podívejme se na příkladech. Scrollujme okno tak, aby byl element nahoře v okně:

javascriptelem.scrollIntoView(true);

A nyní scrollujme okno tak, aby byl element dole v okně:

javascriptelem.scrollIntoView(false);

Jako parametr lze také předat objekt s nastavením. Plynule scrollujme okno k elementu:

javascriptelem.scrollIntoView({
  behavior: 'smooth',
});

Objekt s nastavením má také možnosti zarovnání stránky vzhledem k elementu. Nastavení block zadává vertikální zarovnání, a nastavení inline - horizontální. Mohou přijímat následující hodnoty: 'start', 'center', 'end', 'nearest'.

Zkusme to:

javascriptelem.scrollIntoView({
  behavior: 'smooth',
  block: 'start',
  inline: 'end',
});