Animate.css Like CSS3 Animation Library – vivify.css

Category: Animation , CSS & CSS3 , Recommended | August 29, 2017
Author:Martz90
Views Total:1,069 views
Official Page:Go to website
Last Update:August 29, 2017
License:MIT

Preview:

Animate.css Like CSS3 Animation Library – vivify.css

Description:

vivify.css is a powerful Animate.css library CSS3 animation library which comes with 68+ animations with support for delay and duration.

How to use it:

Just insert the minified version of the vivify.css library into the document and we’re ready to go.

<link href="/css/vivify.css" rel="stylesheet">

Add an animation class of your choice to the element. All available animation classes:

  1. ball
  2. blink
  3. driveInBottom
  4. driveInLeft
  5. driveInRight
  6. driveInTop
  7. driveOutBottom
  8. driveOutLeft
  9. driveOutRight
  10. driveOutTop
  11. fadeIn
  12. fadeInBottom
  13. fadeInLeft
  14. fadeInRight
  15. fadeInTop
  16. fadeOut
  17. fadeOutBottom
  18. fadeOutLeft
  19. fadeOutRight
  20. fadeOutTop
  21. flip
  22. flipInX
  23. flipInY
  24. flipOutX
  25. flipOutY
  26. fold
  27. hitLeft
  28. hitRight
  29. jumpInLeft
  30. jumpInRight
  31. jumpOutLeft
  32. jumpOutRight
  33. popIn
  34. popInBottom
  35. popInLeft
  36. popInRight
  37. popInTop
  38. popOut
  39. popOutBottom
  40. popOutLeft
  41. popOutRight
  42. popOutTop
  43. pullDown
  44. pullLeft
  45. pullRight
  46. pullUp
  47. pulsate
  48. rollInBottom
  49. rollInLeft
  50. rollInRight
  51. rollInTop
  52. rollOutBottom
  53. rollOutLeft
  54. rollOutRight
  55. rollOutTop
  56. shake
  57. spin
  58. spinIn
  59. spinOut
  60. swoopInBottom
  61. swoopInLeft
  62. swoopInRight
  63. swoopInTop
  64. swoopOutBottom
  65. swoopOutLeft
  66. swoopOutRight
  67. swoopOutTop
  68. unfold

To add delay & duration to the animation…

delay-2500
duration-5000

You Might Be Interested In:


Leave a Reply