Loading options for Lottie Animations.

It'd be great to have the same loading options you get for images, for lottie animations.

One thing preventing me from creating cool lottie animations is the fact the page loads before the lottie animation has a chance to fully load.

The interaction trigger for 'When page finishes loading' seems to ignore lottie load times. It'd be great if lottie load times were factored in here.

  • William Cubitt-Smith
  • Dec 11 2020
  • Reviewed
  • Kinanti Desyanandini commented
    05 Jul 03:58

    JJ Bastida's solution worked great - thanks for sharing!

  • Catalin D. commented
    27 May 06:28

    Awesome JJ Bastida! That's what I love about this community, there's always someone that has already found a solution and they are willing to share it with everyone.

  • JJ Bastida commented
    19 Mar 21:54

    Hey, William,
    We recently made a Lottie Lazy Loader script that improves load time when you have a large number of Lottie animations on your site.

    It stops the default load and only loads the Lottie animations when a user scrolls onto them. It also pauses any animations that are not onscreen to better improve performance!

    Check it out on Github and feel free to reach out if you find any issues with it.
    https://github.com/athlonstudio/webflow-lottie-lazy-loader

  • James Clements commented
    January 24, 2022 21:56
  • James Clements commented
    January 24, 2022 21:12

    +1 — in the meantime, is there any workaround for this? A code snippet to set it to eager loading, or listen until it's loaded?

  • +17