【CSS】無料のCSSアニメーションライブラリVivify

CSS

vivify

February 12, 2018

Vivifyは無料のCSSアニメーションライブラリです。

Usage

vivify.cssファイルをheadに含める。

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

List of class names you can add

アニメートする要素にvivifyクラスを追加します。アニメーションを無限にしたい場合は、infiniteクラスを追加することもできます。

  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

MIT

Latest Posts

Related Posts