Element: scrollIntoView() method

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2020.

The Element interface's scrollIntoView() method scrolls the element's ancestor containers such that the element on which scrollIntoView() is called is visible to the user.

Syntax

js
scrollIntoView()
scrollIntoView(alignToTop)
scrollIntoView(scrollIntoViewOptions)

Parameters

alignToTop Optional

A boolean value:

  • If true, the top of the element will be aligned to the top of the visible area of the scrollable ancestor. Corresponds to scrollIntoViewOptions: {block: "start", inline: "nearest"}. This is the default value.
  • If false, the bottom of the element will be aligned to the bottom of the visible area of the scrollable ancestor. Corresponds to scrollIntoViewOptions: {block: "end", inline: "nearest"}.
scrollIntoViewOptions Optional

An Object with the following properties:

behavior Optional

Determines whether scrolling is instant or animates smoothly. This option is a string which must take one of the following values:

  • smooth: scrolling should animate smoothly
  • instant: scrolling should happen instantly in a single jump
  • auto: scroll behavior is determined by the computed value of scroll-behavior
block Optional

Defines vertical alignment. One of start, center, end, or nearest. Defaults to start.

inline Optional

Defines horizontal alignment. One of start, center, end, or nearest. Defaults to nearest.

Return value

None (undefined).

Examples

js
const element = document.getElementById("box");

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

Notes

The element may not be scrolled completely to the top or bottom depending on the layout of other elements.

Specifications

Specification
CSSOM View Module
# dom-element-scrollintoview

Browser compatibility

Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
scrollIntoView
options parameter

See also