animate.css
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" />
4.43
7
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.0.0/animate.min.css" />
/*
==========================================
Animation Using Animate.css Library
==========================================
We can use these styling to apply animate.css using css:
animation: bounce;
animation-duration: 2s;
animation-iteration-count:
animation-delay: 1s;
Utility classes: (Animate.css comes packed with a few utility classes to simplify its use)
Always use "animate__animated" keyword to activate animation. Then we can use below classes to start animation.
animate__fadeIn animate__slow 2s animate__repeat-1 1 animate__delay-2s
animate__fadeInDown animate__slower 3s animate__repeat-2 2 animate__delay-3s
animate__fadeInLeft animate__fast 800ms animate__repeat-3 3 animate__delay-4s
animate__fadeInRight animate__faster 500ms
animate__fadeInUp
*/
Thank you!
7
0
3.89
9
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"
/>
Thank you!
9
0
0
6
$ npm install animate.css --save
Thank you!
6
0
0
5
$ yarn add animate.css
Thank you!
5
0
3.75
8
.my-element {
display: inline-block;
margin: 0 0.5rem;
animation: bounce; /* referring directly to the animation's @keyframe declaration */
animation-duration: 3s; /* don't forget to set a duration! */
}
Thank you!
8
0
Are there any code examples left?
New code examples in category CSS