Metode til at scrolle vinduet til et element i JavaScript

Metoden scrollIntoView scroller vinduet til det givne element. Metoden anvendes på elementet, som vinduet skal scrolles til. Metodens parameter styrer, hvor elementet skal placeres: øverst i vinduet eller nederst.

Lad os se på eksempler. Lad os scrolle vinduet, så elementet er øverst i vinduet:

elem.scrollIntoView(true);

Og nu scroller vi vinduet, så elementet er nederst i vinduet:

elem.scrollIntoView(false);

Man kan også sende et objekt med indstillinger som parameter. Lad os scrolle vinduet glat til elementet:

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

Objektet med indstillinger har også indstillinger for justering af siden i forhold til elementet. Indstillingen block angiver den lodrette justering, og indstillingen inline - den vandrette. De kan tage følgende værdier: 'start', 'center', 'end', 'nearest'.

Lad os prøve:

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

Givet et element og en knap. Ved klik på knappen skal du scrolle siden til dette element. Prøv alle de beskrevne muligheder.