I'm using the ScollTo plugin to hijack the scrolling of the user:
I've got multiple sections.
Once the user scrolls a little bit the first scrollTo animation gets triggered and scroll the whole window to the second section.
Once the user scrolls down more it automatically scrolls down to a third section.
To achieve this I've use this code:
let tlhomescroll = gsap.timeline({
scrollTrigger: {
trigger: '.o-herotall__bg',
start: "top top",
end: "bottom center",
autoKill: false,
markers: true,
pin: false,
scrub: false,
toggleActions: "restart none none none"
}
});
tlhomescroll
.to(window, {duration: 1.5, ease: "power3.inOut", scrollTo: "#section2"});
using "o-herotall__bg" as a trigger on my 1st section it scrolls to section 2. I then do the same for section 2 to section 3.
This all works fine, but the problem is:
Once the user scolls down and reloads the page or comes back from another page to this on on a lower scroll position, the scrollTo is triggered and the window scrolls to section 3.
How can I prevent the scroll event from triggering when the page isn't loaded at the top?
