How to let the chrome forget the page scroll position?

Question

For instance, I open a web page, and scroll down to some position,

then I refresh the chrome browser, the browser could scroll the previous position again

How can I use javascript or css to let the browser to forget the scroll?

I have try $(window).scrollTop(0), but it doesn't work

scrollTop-ing late enough is the only thing I can think of. Say, 50ms after the page load. It seems hacky though. — John Dvorak
– John Dvorak, Commented Mar 12, 2013 at 7:51
@Jan it is hacky, on the other hand the whole theme is a bit hacky. — Linus Caldwell
– Linus Caldwell, Commented Mar 12, 2013 at 7:52
you might need to put it in the documents onready, in which case it should work — rtpg
– rtpg, Commented Mar 12, 2013 at 8:19
Possible duplicate of Disable brower's auto scroll after a page refresh? — Josh Lee
– Josh Lee, Commented Aug 18, 2017 at 14:01

Brian Zhang · Accepted Answer · 2017-08-18 13:49:19Z

35

It is resolved in the question below.

Disable brower's auto scroll after a page refresh?

// bypass auto scrolling. if ('scrollRestoration' in history) { history.scrollRestoration = 'manual'; }

answered Aug 18, 2017 at 13:49

Brian Zhang

4714 silver badges4 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

nbrustein Over a year ago

This works, but required some extra tweaking for me.

steven87vt Over a year ago

this is so simple and it took 2 days to find out about scrollRestoration... thank you!

Gavin Over a year ago

Works great! And all the major browsers now support it caniuse.com/?search=scrollRestoration

user151496 Over a year ago

this is the only correct solution, as the other ones will actually FORCE the browser to autoscroll to the position 0 after window is refreshed. and you might not want to do this, but instead scroll to your own computed position

Afshin Mehrabani · Accepted Answer · 2013-03-12 07:50:27Z

3

A simple way that I can say is to run this code on page load:

document.location = "#";

OR

window.scrollTo(0);

It set the browser viewport to the top of the page, again.

answered Mar 12, 2013 at 7:50

Afshin Mehrabani

35.3k33 gold badges146 silver badges209 bronze badges

6 Comments

John Dvorak Over a year ago

If I remember correctly, do window.scrollTo(0) on page load, and Chrome overrides your scroll.

John Dvorak Over a year ago

I meant even window.onload is too soon for window.scrollTo. Several miliseconds after window.onload should do, however.

hh54188 Over a year ago

If I want the page scroll to left, not the top, what should I do?

ericsoco Over a year ago

Seconding @JanDvorak's findings. A setTimeout within window.onload works, but by then the window has already scrolled.

joe Over a year ago

window.scrollTo(0) throws "cannot convert to dictionary" in Chrome and Firefox. Seems that you need to specify x and y like so: window.scrollTo(0, 0)

|

Walex · Accepted Answer · 2014-01-16 21:54:10Z

Here is a clean way of getting this done.

window.addEventListener('unload', function(e){ document.body.style.display = 'none'; });

By simply setting the body display to 'none' you don't have to worry about a flash of the browser scrolling to the top of the page before it is unloaded and the scroll position will automatically be reset to 0.

body hidden is not work; change to window.scrollTo(0, 0); it will done.

Harsha Vardhan Chakka · Accepted Answer · 2021-03-04 16:12:22Z

This worked for me :

JS Way:

window.addEventListener('unload', function(e){ window.scrollTo(0, 0) });

Jquery way:

$(window).load(function() { $(window).scrollTop(0); });

Hakan · Accepted Answer · 2025-05-05 09:05:36Z

Another option may be adding and removing overflow:hidden; to body html or element

Collectives™ on Stack Overflow

How to let the chrome forget the page scroll position?

5 Answers 5

4 Comments

6 Comments

1 Comment

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

4 Comments

6 Comments

1 Comment

Comments

Comments

Linked

Related