Run your animations easily with the CSS animation shorthand:
animation: crazy 4s ease-in-out 0.5s 12 backwards;
- crazy: Animation name
- 4s: Duration
- ease-in-out: Timing function
- 0.5s: Delay
- 12: Iteration count
- backwards: Fill mode
🐊 Alligator.io recommends ⤵Advanced CSS and Sass: Flexbox, Grid, Animations and More!
animation-timing-function can take one of the following values: linear, ease, ease-in, ease-out, ease-in-out or cubic-bezier(…).
animation-fill-mode can take one of the following values: none, forwards, backwarts or both.