DEV Community

Cover image for How to use Animate CSS and create stunning effects in seconds? - 3 projects

How to use Animate CSS and create stunning effects in seconds? - 3 projects

Duomly on May 07, 2020

This article was originally published at https://www.blog.duomly.com/how-to-use-animate-css-tutorial-with-examples/ A few years ago, I was work...
Collapse
 
jkga profile image
kenabella

Nice!.. By the way, v4.0 has been released and they are now an organization.
GIthub: github.com/animate-css
Docs: animate.style/

Collapse
 
madza profile image
Madza

+1 was about to say, used animate.css a while ago and was surprised to see the changes now

Collapse
 
duomly profile image
Duomly

Thanks! :)

Collapse
 
lyas777 profile image
lyas

Buena información :D

Collapse
 
duomly profile image
Duomly • Edited

Gracias! Yo soy feliz :)

Collapse
 
lyas777 profile image
lyas

Ya me suscribí a tu canal de YouTube 😄 and I will learn english too 😁

Thread Thread
 
duomly profile image
Duomly • Edited

Gracias por subscription! Video es la buena metoda. Yo necesito aprende mas bueno espanol :D :D

Collapse
 
mahanandame profile image
mahananda

Thanks for you write a beautiful article, it's very very helpful.

Collapse
 
duomly profile image
Duomly

Thank you! :)

Collapse
 
alex95599499 profile image
Alex • Edited

One more point.

Clicking or hovering the mouse should trigger the animation. Use the class add operator. After animation, remove this class. How to find out the animation is over. I use the el.addEventListener("animationend", () => { //del class// }); function for this. I found information about this here:

profi.spage.me/css/use-css-library...

Collapse
 
cat profile image
Cat

I LOVE this library. I've used it for 90% of my projects so far!

Collapse
 
duomly profile image
Duomly • Edited

Yeah! Its awesome!
Feel free to share some of your ideas for animations :)