Prevent scrolling when page refreshes with refresh code in head

Question

I have page refresh code in the head of my page. That part works well. But if the user is scrolled down on the page, when the refresh hits, the page scrolls to the top. I want to prevent the scroll up, leave the page alone, just do the refresh and no scrolling

This is what I have tried

<script>

    window.onload = setupRefresh;
 
    function setupRefresh() {
      setTimeout("refreshPage();", 2000); // milliseconds
    }
    function refreshPage() {
       window.location = location.href;
    
    }
</script>
<script>

if ('scrollRestoration' in history) {
  history.scrollRestoration = 'manual';
}
</script>

Perhaps these help : [reload-page-without-scrolling-up](https://stackoverflow.com/questions/36212683/reload-page-without-scrolling-up) and [refresh-page-and-keep-scroll-position](https://stackoverflow.com/questions/17642872/refresh-page-and-keep-scroll-position) — Asif Kamran Malick, Mar 07 '21 at 05:00

score -1 · Answer 1 · answered Mar 08 '21 at 08:05

Here is the solution because I am 100% certain somebody else will be asking for this:

    <head>
    <script>
        document.addEventListener("DOMContentLoaded", function(event) { 
            var scrollpos = localStorage.getItem('scrollpos');
            if (scrollpos) window.scrollTo(0, scrollpos);
        });

        window.onbeforeunload = function(e) {
            localStorage.setItem('scrollpos', window.scrollY);
        };
    </script>

<script>

    window.onload = setupRefresh;
 
    function setupRefresh() {
      setTimeout("refreshPage();", 2000); // milliseconds
    }
    function refreshPage() {
       window.location = location.href;
    
    }
</script>
</head>

Prevent scrolling when page refreshes with refresh code in head

1 Answers1