How to get and set the current web page scroll position

Question

How can I get and set the current web page scroll position   I have a long form which needs to be refreshed based on user actions input   When this happens  the page resets to the very top  which is annoying to the users  because they have to scroll back down to the point they were at   If I could capture the current scroll position  in a hidden input  before the page reloads  I could then set it back after it reloads

User · Answer

The currently accepted answer is incorrect - document.documentElement.scrollTop always returns 0 on Chrome. This is because WebKit uses body for keeping track of scrolling, whereas Firefox and IE use html.

To get the current position, you want:

document.documentElement.scrollTop || document.body.scrollTop

You can set the current position to 1000px down the page like so:

document.documentElement.scrollTop = document.body.scrollTop = 1000;

Or, using jQuery (animate it while you're at it!):

$("html, body").animate({ scrollTop: "1000px" });

User · Answer

I went with the HTML5 local storage solution     All my links call a function which sets this before changing window location   localStorage topper   document body scrollTop    and each page has this in the body s onLoad     if localStorage topper  gt  0        window scrollTo 0 localStorage topper

User · Answer

There are some inconsistencies in how browsers expose the current window scrolling coordinates  Google Chrome on Mac and iOS seems to always return 0 when using document documentElement scrollTop or jQuery s   window  scrollTop     However  it works consistently with      horizontal scrolling amount window pageXOffset     vertical scrolling amount window pageYOffset

User · Answer

You re looking for the document documentElement scrollTop property

[javascript] How to get and set the current web page scroll position?

Examples related to javascript

Examples related to html