在加载或单击时将新页面滚动到顶部

Question

I'm using barba.js to fade new pages in. Code must be placed between the barba wrapper div. When I click a link to a new page though, the new page fades in at the same position as the previous page was in. So if the user clicks a link near the footer, the new page is loading in near it's footer, which I don't want. How can I get the new page to load in at the top? I tried adding a class to the links:

<a class="foo" href="newpage.html">link</a>

and adding this to the footer (inside the barba wrapper like all the other js):

<script>
    $(".foo").click( function() {
        $(window).scrollTop(0);
    });
</script>

but it doesn't work.

Answer 1

Found the answer. On the barba js you have to add:

$(window).scrollTop(0);
if ('scrollRestoration' in history) {
    history.scrollRestoration = 'manual';
}

to the top of the

fadeIn: function () {

Answer 2

For me there was only one solution that works:

barba.hooks.enter(() => {
document.body.scrollTop = 0;
});