Window pageYOffset

❮ Previous ❮ Window Object Reference Next ❯

Example 1

Scroll the content by 100 pixels, and alert the pageXOffset and pageYOffset:

window.scrollBy(100, 100);
alert(window.pageXOffset + window.pageYOffset);

Try it Yourself »

More examples below.

Description

The pageYOffset property returns the pixels a document has scrolled from the upper left corner of the window.

The pageYOffset property is equal to the scrollY property.

The pageYOffset property is read-only.

Syntax

window.pageYOffset

or just:

pageYOffset

Return Value

Type	Description
A number	The number of pixels the document has scrolled from the upper left corner of the window.

More Examples

Create a sticky navigation bar:

// Get the navbar
const navbar = document.getElementById("navbar");

// Get the offset position of the navbar
const sticky = navbar.offsetTop;

// Add the sticky class to the navbar when you reach its scroll position. Remove the sticky class when you leave the scroll position.
function myFunction() {
if (window.pageYOffset >= sticky) {
navbar.classList.add("sticky")
} else {
navbar.classList.remove("sticky");
}
}