In this section, we will learn what the Element scrollTop property is and how to use it in JavaScript.

What is Element scrollTop Property in JavaScript?

The JavaScript Element scrollTop property is used to set or get the number of pixels and element is scrolled vertically.

Note: if you want to have a vertical scroll-bar appear on an element, fix the height of that element, put the `overflow` property to `auto` and set the height of its child element to a value greater than the height of the parent element.

Element scrollTop Property Syntax:

element.scrollTop;

element.scrollTop = newValue;

Element scrollTop Property Input Value

The value we set for this property is an integer value which represents the number of pixels the target element should scroll vertically.

Element scrollTop Property Return Value

The return value of this method is the current number of pixels that the element scrolled vertically.

Example: using scrollTop Property in JavaScript

See the Pen using scrollTop Property in JavaScript by Omid Dehghan (@odchan1) on CodePen.