Element.scrollIntoView()

The Element.scrollIntoView() method scrolls the current element into the visible area of the browser window.

Syntax

element.scrollIntoView(); // Equivalent to element.scrollIntoView(true)
element.scrollIntoView(alignToTop); // Boolean arguments
element.scrollIntoView(scrollIntoViewOptions); // Object argument

Parameters

alignToTop

Is a Boolean value:

• If true, the top of the element will be aligned to the top of the visible area of the scrollable ancestor.
• If false, the bottom of the element will be aligned to the bottom of the visible area of the scrollable ancestor.

scrollIntoViewOptions

A boolean or an object with the following options:

{
  behavior: "auto"  | "instant" | "smooth",
  block:    "start" | "end",
}

If it is a boolean, true corresponds to {block: "start"} and false to {block: "end"}

Example

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

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

Notes

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

Specifications

Browser compatibility

[1] Supports scrollIntoView with boolean parameter, but not smooth behavior option

See also

• Element.scrollIntoViewIfNeeded()