Streaming live at 10am (PST)

Synchronize sectioned Lottie Animation with text sections

Greetings friends!

I am struggling with combining scroll-snap and my background lottie animation.
The animation contains different sections and is supposed to synch with the text sections scrolling into view.
While using the page scroll trigger and splitting the animation in different percentages doesn’t seem to work with the scroll snap, and mostly hijackes the page scroll i thought about using element triggers to play the corresponding part of the animation once the section scrolls into view. While this works in one direction i.e. section 1 to 2, 2 to 3 and so on, i can’t seem to get the opposite to work i.e. 3 to 2, 2 to 1 which also results in the animation 2 to 1 playing on page load.

Maybe someone can help, thank you!


Here is my public share link: LINK
(how to access public share link)