All Animation

All animation.css is a set of fun animations to make your project sexier. They are cross-browser animations but that will emphasize your pages as sliders , 3D effects 's .

move to the Portuguese language

##Try the demo View demo

Contributors:

If you want to contribute to our project, read the file: contributing.md ;)

How to use:

It's easy to use this css framework: D we will see step by step how to use it ...

Step 1, include the necessary files in the head , so that the framework work correct:

download the all animation: click here

<link rel="stylesheet" type="text/css" href="yourpath/all-animation.css" />
<script type="text/javascript" src="yourpath/jquery.js"></script>

Step 2, html:

<div id="animation"></div>

<button class="anny-class">Trigger class, go!</button>

Step 3, Jquery:

$(".anny-class").click(function(){
 $("#animation").addClass("journal");
});

Optional

If you want to add the effect at some specified time , it is to place a timer ;)

ex, placing an animation in a particular element , after 2 seconds:

setTimeout(function(){
 $("#animation").addClass("journal");
},2000);

Caution:

If you want to add some animation on an element that has suffered another animation of this framework , or want to restart the animation , you have to remove the last animation and submit your. Ex:

 $("#animation").removeClass("journal").addClass("four-rock");

We have several classes in place of the journal class, let's see which are:

Especiais:

• dance
• journal
• pulse
• pulse-slow
• jamp
• four-rock

Bounce:

• enter-up-bounce
• enter-down-bounce
• enter-right-bounce
• enter-left-bounce
• scale-bounce
• jump-bounce

Perspective:

• tree-flip-right
• tree-flip
• tree-flip-up
• tree-flip-down
• flip-left-bounce
• rotate-flip
• flip-right-bounce

Fading Entrances:

• flip-top
• flip-left
• flip-right
• flip-bottom

Rotate:

• rotate-flip-down
• rotate-down-bounce
• rotate-out

Agrecives:

• flash-bang
• bomba

####Credits:

Clóvis Neto