White Arrow icon
Back to all Elements

Modal Lottie Transition

A full screen close/open animation with lottie

A clonable project using lottie animation to transition a modal opening and closing.

The only line of code used is to make the lottie element "transparent" for the pointer:

pointer-events: none;

Copy

Best thing is that you can look under the hood and clone this project, so you can figure out how to do one yourself ;)

Preview:

Share:

Michael's Vsauce was my gateway Youtube channel to the world of fun educational vlogs. This was the 1st video I stumbled upon.

Might also interest you:

Symbol in RichText

Cloneable
CMS
Code

Insert a symbol element into a RichText. On a static or dynamic page.

Read more
White Arrow icon

Round Scroll Indicator / Progress Bar

Cloneable
Interactions
Animation

A round scroll indicator mad with Webflow elements and interactions

Read more
White Arrow icon

Pass Parameters

Cloneable
Code

Pass input fields parameters and add them to the destination URL.

Read more
White Arrow icon