I added some page transitions to my site. Now whenever someone clicks on the browser back button, that redirects him to his previous site, his scroll position on that page gets restored automatically. If the user has scrolled down on the previous page, this behavior leads to an ugly page jump in the current window less than a second before it fades out.

1) Am I able to delay this default browser behavior?

2) If 1 is not possible, am I able to disable the default behavior and store & restore scroll positions manually instead?

I added some page transitions to my site. Now whenever someone clicks on the browser back button, that redirects him to his previous site, his scroll position on that page gets restored automatically. If the user has scrolled down on the previous page, this behavior leads to an ugly page jump in the current window less than a second before it fades out.

1) Am I able to delay this default browser behavior?

2) If 1 is not possible, am I able to disable the default behavior and store & restore scroll positions manually instead?

• javascript
• google-chrome
• firefox
• back
• browser-history

• Possible duplicate of stackoverflow.com/questions/7035331/…. – djfdev Commented Jan 19, 2018 at 21:16
• What browser do you use ? Im using Firefox and if i open some website e.g. thelocal.de/berlin scroll down to some news and open it, and from that news page if i press browser back browser displays scrolled to previous position from where i pressed on news, it is default browser behaver - isn't it what you looking for ? – Armen Commented Jan 20, 2018 at 7:38
• @Armen No it is not what I want. Either I want to be able to control when this happens or I want to disable the behavior and do this on my own. But essentially, everything I want is control over when the browser does this as this effect does not play well with my animations. – heroxav Commented Jan 20, 2018 at 8:25
• @djfdev None of the solutions proposed in the linked article appear to work for me. – heroxav Commented Jan 20, 2018 at 8:49
• You can also set view height 100% of window with overflow hidden (disable scrollbar) before load and enable when you want, but I never tried.. – bigless Commented Jan 20, 2018 at 13:22

1 Answer 1

Although it is experimental, you can try adjusting the History scrollRestoration from "auto" to "manual".

There are a few polyfills out there to help with cross-browser compatability too.

if ('scrollRestoration' in history) {
  // Back off, browser, I got this...
  history.scrollRestoration = 'manual';
}