maintain scroll position between pages

  • Hi,
    I have a very open question. Perhaps anybody can across something I could not find..

    I want to maintain the scroll position after clicking on a link which opens another page.
    The page has a similar layout (only different images and colours).
    So for the user it looks like it’s the same page but only the colours and images change after clicking the button.

    Has something similar been written before of perhaps a plugin?

    Hope somebody can help or send down the right path.

    Kind regards,
    Emile

    • This topic was modified 3 years, 7 months ago by Jan Dembowski. Reason: Moved to Fixing WordPress, this is not an Developing with WordPress topic
Viewing 1 replies (of 1 total)

  • Hi @foodstijl,
    You could put this code frame just above your closing </body> tag for all your pages.

    
<script>
document.addEventListener('DOMContentLoaded', function() {
    if(typeof(Storage) !== 'undefined') {
        // See if there is a scroll pos and go there.
        var lastYPos = +localStorage.getItem('scrollYPos');
        if (lastYPos) {
            console.log('Setting scroll pos to:', lastYPos);
            window.scrollTo(0, lastYPos);
        }

        // On navigating away first save the position.
        var anchors = document.querySelectorAll('article a');

        var onNavClick = function() {
            console.log('Saving scroll pos to:', window.scrollY);
            localStorage.setItem('scrollYPos', window.scrollY);
        };

        for (var i = 0; i < anchors.length; i++) {
            anchors[i].addEventListener('click', onNavClick);
        }
    }
});
</script>

    Let me know if my answer can help you resolve your issue.

Viewing 1 replies (of 1 total)
  • The topic ‘maintain scroll position between pages’ is closed to new replies.