Lottie

How it works

Lottie widget is built on top of LottieFiles integration.
You can choose from a wide variety at lotties available at LottieFiles and set them at Lottie element’s source input as an external URL.

Animation controls

Autoplay: determines whether the lottie should autoplay when page loads.
Loop: determines whether the lottie autoplay should play in a loop. Requires autoplay to be true.
Speed: lottie’s speed animation.
Mode: there are 2 modes available that determine the trigger event: cursor or scroll.

Cursor controls

Cursor type: Cursor Type will determine the cursor mode that will trigger the lottie: hover or click.
Force flag: determines if the lottie should restart on each hover or click.

Scroll controls

Scroll type: determines the animation of the lottie when scrolling. Seek (animation attached frame by frame to the scroll) or Play (when it enters the viewport).
Start & End visibility: these parameters determine the starting and ending point of the lottie animation when they enter the viewport.
Start & End frame: the frames that determine the start and the end of the lottie animation. You can know them by opening your lottie’s URL at the browser and search for “ip” (first frame) and “op” (last frame).