How to get the scroll position of an element in JavaScript

Dec 1, 2018

Learn how to get the scroll position of an element in JavaScript by reading its scrollTop and scrollLeft properties, which you can also set to scroll it.

~~~

How can you do that?

Once you have the element, you can inspect its scrollLeft and scrollTop properties.

The 0, 0 position is always found in the top left corner, so any scrolling is relative to that.

Example:

const container = document.querySelector('. container')
container.scrollTop
container.scrollLeft

Those properties are read/write, so you can also set the scroll position:

const container = document.querySelector('. container')
container.scrollTop = 1000
container.scrollLeft = 1000

Browser developer console showing scrollTop value of 425 and scrollLeft value of 485 for a blue scrollable element

Tagged: Web Platform · All topics

~~~