Streaming live at 10am (PST)

How to stop looping lottie animation?

Hello to all!

Let’s say we have a looped lottie animation in the preloader. How can I stop the animation? So that after hiding the preloader, this lottie does not play and does not load the computer.

Hello @GearFX,

that is a good question, specially if you are looping a big animation. I think you can stop the looping depending on how you hide the preloader. If you used an animation to hide the Lottie file add another step where you just unchecked the loop option, im not sure if that is an option, but you can just set the duration to 0. I hope this helps.

Unfortunately just hiding a lottie will not help. It will be played in a hidden state, unlike a video that stops. If you put a loop in the element’s settings, then any interaction (even which did not happen) automatically removes the loop. If you make a loop through interactions, then it will be the main thing and it can not be stopped by other steps.

I have been using lottie in custom code for a long time. And I stopped the animation through the appearance of the DOM element in the viewport.

I see @GearFX. So you got it to stop the loop?

Only by embedding lottie through custom code. The standard webflow element cannot be stopped.

1 Like

Got it @GearFX, maybe webflow will push a fix for this issue in the future. The lottie integration is relatively new.