Window scrollY property

Definition and usage

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

scrollY property is read-only.

Tip

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 leaving 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 The number of pixels scrolled from the top-left corner of the document.

Browser support

Tutti i browser supportano window.scrollY：

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