Window scrollY property

Definition and Usage

scrollY property returns the number of pixels the document has scrolled from the top left corner of the window.

scrollY property is read-only.

Hint

scrollY property is equal to pageYOffset property.

For cross-browser compatibility, please use window.pageYOffset Instead of window.scrollY.

See also:

pageXOffset property

pageYOffset property

Example

Example 1

Scroll the content by 100 pixels and prompt scrollX and scrollY:

window.scrollBy(100, 100);
alert(window.scrollX + window.scrollY);

Try it yourself

Example 2

Create a sticky navigation bar:

// Get the navigation bar
const navbar = document.getElementById("navbar");
// Get the offset position of the navigation bar
const sticky = navbar.offsetTop;
// Add the sticky class to the navigation bar when you reach its scroll position. Remove the sticky class when you leave the scroll position.
function myFunction() {
  if (window.scrollY >= sticky) {
    navbar.classList.add("sticky")
  }
    navbar.classList.remove("sticky");
  }
}

Try it yourself

Syntax

window.scrollY

Or:

scrollY

Return value

Type Description
Number Document scrolling from the top left corner of the window in pixels.

Browser supports

Lahat ng mga browser ay sumusuporta window.scrollY：

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Suporta 9-11 Suporta Suporta Suporta Suporta