Prevent scroll jump during refreshing a long HTML page

Question

On refreshing a long HTML page, the scroll position is initialized to the top and then jumped to the last scroll position.

Is there a way to stop this scroll jump behavior on refresh and just initialize scroll position to last scroll position?

Answer 1

How about use html5 localStorage function.

window.addEventListener('scroll', function () {
    localStorage.scrollX = window.scrollX;
    localStorage.scrollY = window.scrollY;
})
window.addEventListener('load',function () {
    window.scrollTo(localStorage.scrollX || 0, localStorage.scrollY || 0);
})

Check it on http://jsfiddle.net/g5NKG/10/show/

Answer 2

It sounds like you may need the .scrollTop() method from jQuery found here

So:

$(document).ready(function(){
    $(this).scrollTop(0);
});

From link in comments, this also is a quick fix:

$(document).scrollTop(0);

Answer 3

Isn't this just default browser behavior? What you're describing sounds like all mayor browsers are already doing it like that.