element.scrollIntoView

The Element.scrollIntoView() method scrolls the element on which it's called 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 Optional

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. 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.

scrollIntoViewOptions Optional

A Boolean or an object with the following options:

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

If it's a Boolean value, 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

Specification	Status	Comment
CSS Object Model (CSSOM) View Module The definition of 'Element.scrollIntoView()' in that specification.	Working Draft	Initial definition

Browser compatibility

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

See also

• Element.scrollIntoViewIfNeeded()