I'm trying to put somme animation between my home and my single page using barba.js (if something works better with wordpress let me know), Actually when I click to my post, the single page is scrolled as the other page was, it restore the scroll even When I put
barba.hooks.before(() => {
if (history.scrollRestoration) {
history.scrollRestoration = 'manual';
}
});
barba.init({
debug: true,
transitions: [{
name: 'projet-transition',
from: {
namespace: [
'home'
]
},
to: {
namespace: [
'projet'
]
},
enter(data) {
console.log(data)
},
leave(data) {
console.log(data)
},
}]
});
To reset the scroll position when navigating through links, you can do this:
barba.hooks.enter(() => {
window.scrollTo(0, 0);
});
About scrollRestoration
History.scrollRestoration affects back and forward history navigation. If you need to restore scroll position when navigating backwards or forwards, check out this barba.js github issue. If not, I think it would be better if you don't set scrollRestoration to manual in the before hook, which runs on every page transition. You can place it outside barba hooks or in the beforeOnce hook.