Lightweight CSS Animation Framework – Efecss.css

Category: Animation , CSS & CSS3 | March 20, 2017
Author: efecss
Views Total: 691
Official Page: Go to website
Last Update: March 20, 2017
License: MIT

Preview:

Lightweight CSS Animation Framework – Efecss.css

Description:

Efecss.css is a tiny CSS library for adding CSS3 based animations to any elements just like the famous animate.css.

Install it via NPM:

$ npm install --save effecss-pure-css

How to use it:

Import the efecss.css into your html page.

<link href="efecss.css" rel="stylesheet">

Add the following CSS classes to the elements you want to animate.

  • slide-up-in
  • slide-down-in
  • slide-left-in
  • slide-right-in
  • slide-up-out
  • slide-down-out
  • slide-left-out
  • slide-right-out
  • fade-in
  • fade-out
  • zoom-in-radial
  • zoom-in
  • zoom-out-radial
  • zoom-out
  • pulse
  • bounce-top-in
<h2 class="slide-up-in">slide-up-in</h2>

Specify the animation should be played infinite times:

<h2 class="forever slide-up-in">slide-up-in</h2>