Adding animations to elements

Showcase Tips and Tricks
1

Thought I’d share this little experiment with everyone. You can use this to quickly and easily add animations to an element without having to write the CSS.

  1. Load the library in the app “Custom Header / Footer Code”
  • Place this in the Custom Footer section - <link rel="stylesheet"href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"/>

  1. Open the EDIT dialog for the element/component you want to animate

  2. Add the class animate__animated to an element in the CSS tab of the EDIT dialog, along with any of the animation names (don’t forget the animate__ prefix!):

That’s it!

animations

6 Likes