Search code examples
javascriptgoogle-chromefirefoxbackbrowser-history

JavaScript: Prevent browser from restoring scroll positions when using the back button

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?

Solution

  • 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';
}