Animated timeline - Horizontal Scroll

Design help Animations & Interactions
1

Hey Guys,
I’m having an issue with an animation. It’s located in the about us section (O NAS, The website is in Polish but the animation is English. ) I copied the original idea from

However, they didn’t create a animation when you scroll back so I attempted to do it myself, also I had to add 2 more slides to it as well. The problem is that it works well when you scroll down and it’s still somewhat visible but when you fully scroll down the webpage it dosen’t restart at the end it restart’s in the middle. I have made a different animation for the tablet and phone, which I am also having problems with, to be exact I’m having an issue with the timeline not following the exact spot where it should land. Any help with this will be greatly appreciated, as I’ve spent hours trying to get this sorted and I’m running out of time.

Here is my public share link: Webflow - Potocki Gałkowo

Thank you in advance.

2

Hi there,

To fine-tune your scroll-based animations, you can adjust the trigger offset to control when the animation starts and ends. Here’s how to set it up:

The offset setting determines how far an element needs to be scrolled into the viewport before the animation triggers. Adding a 10% offset to both “When scrolled into view” and “When scrolled out of view” triggers creates a smoother transition. To enable the reverse animation effect when scrolling back up, make sure to check the “Reverse” checkbox under the Lottie playback action in the “When scrolled out of view” section.

Hopefully this helps! If you still need assistance, please reply here so somebody from the community can help.