The Wayback Machine - https://web.archive.org/web/20171112011233/https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView

Element.scrollIntoView()

This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The Element.scrollIntoView() method scrolls the element on which it's called into the visible area of the browser window.

Syntax

element.scrollIntoView();
element.scrollIntoView(alignToTop); // Boolean parameter
element.scrollIntoView(scrollIntoViewOptions); // Object parameter

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. 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
Is an Object with the following properties:
behavior Optional
One of "auto", "instant", or "smooth". Defaults to "auto".
block Optional
One of "start", "center", "end", or "nearest". Defaults to "center".
inline Optional
One of "start", "center", "end", or "nearest". Defaults to "nearest".

Example

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

element.scrollIntoView();
element.scrollIntoView(false);
element.scrollIntoView({block: "end"});
element.scrollIntoView({behavior: "instant", 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 Status Comment
CSS Object Model (CSSOM) View Module
The definition of 'Element.scrollIntoView()' in that specification.		 Working Draft Initial definition

Browser compatibility

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 29 1.0 (1.7 or earlier) 8[1] 38[1] 5.0[1]
scrollIntoViewOptions 61 36 (36)[2][3] No support No support No support
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support 4.3 1.0 (1.0) No support No support 5.0[1]
scrollIntoViewOptions No support[1] 36.0 (36) No support No support No support

[1] No support for "smooth" behavior or "center" options

[2] No support for "inline" option

[3] No support for "nearest" or "center" values for "block" option (see bug 1389274)

See also

Document Tags and Contributors

Tags: 
 Contributors to this page: brianmontanaweb, minsooshin, khs, jihyerish, tremby, styfle, aaronadamsTO, yisibl, Sheppy, phistuck, 0x80, Sebastianz, paul.irish, cvrebert, flying-sheep, fscholz, teoli, ziyunfei, SphinxKnight, kscarfone, nairakhil13, mattbasta, ethertank, mathiasbynens, vali29, Midnightaz, Mgjbot, Nickolay, RobG
 Last updated by: brianmontanaweb,