snippetjavascriptTip

Get the scroll position of the current page using JavaScript

Submitted by: @import:30-seconds-of-code·Mar 2, 2026·

Viewed 0 times

javascriptscrollpagegettheusingpositioncurrent

Problem

JavaScript's Window and Element objects provide a ton of useful properties, which can be leveraged for various different things. One such case is calculating the scroll position of the current page or a specific element.
Starting with the global Window object, we can use the Window.scrollX and Window.scrollY properties to get the scroll position of the current page.
Subsequently, all other elements define the Element.scrollLeft and Element.scrollTop properties, which can be used to calculate the scroll position. This, for example, can be used to get the scroll position of the Document element, or scrollable elements like a div or aside.

Solution

const getWindowScrollPosition = () => ({
  x: window.scrollX,
  y: window.scrollY
});

getWindowScrollPosition(); // {x: 0, y: 200}

Subsequently, all other elements define the Element.scrollLeft and Element.scrollTop properties, which can be used to calculate the scroll position. This, for example, can be used to get the scroll position of the Document element, or scrollable elements like a div or aside.

Code Snippets

const getWindowScrollPosition = () => ({
  x: window.scrollX,
  y: window.scrollY
});

getWindowScrollPosition(); // {x: 0, y: 200}

const getScrollPosition = (el = document.documentElement) => ({
  x: el.scrollLeft,
  y: el.scrollTop
});

getScrollPosition(); // {x: 0, y: 200}
getScrollPosition(document.querySelector('aside')); // {x: 0, y: 120}

Context

From 30-seconds-of-code: get-scroll-position

Revisions (0)

No revisions yet.