Welcome to Ng-Css-Animate:

A simple Angular Directive to trigger animation from animation.css via various ways based on the attributes given in tag.Very simple to use and easy to implement.All you need is to add ngcssanimator in your app and add the directive in the html elements which you want to animate

How To Use:

Without event[Default]:

<div class="anidiv" ani ani-class ="bounce"></div>

Without event and Start Delay :

<div class="anidiv" ani ani-class ="bounce" ani-delay-start="2000"></div>

Without event Infinite Times:

<div class="anidiv" ani ani-class ="bounce" ani-additional-class="infinite"></div>

With event OnClick Infinite Times:

<div class="anidiv" ani ani-class ="fadeIn" ani-event="click" ></div>

With event OnClick only one Time:

<div class="anidiv" ani ani-class ="flash" ani-event="click" ani-event-once="true" ></div>

Click on Button Infinite Times:

<div class="anidiv" ani ani-class ="flipInX"  ani-trigger-element-id="btn1"
ani-trigger-element-event="click"></div>

Click on Button only one Time:

<div class="anidiv" ani ani-class ="flipInX"  ani-trigger-element-id="btn1"
ani-trigger-element-event="click" ani-trigger-once="true"></div>

Using Class From Scope variable:

<div class="anidiv" ani  ani-scope-class-var="animationclass"></div>

Combining all:

<div class="anidiv" ani ani-class ="bounce" ani-event="click" ani-event-once="true"
ani-scope-class-var="animationclass" ani-trigger-element-id="animateit"
ani-trigger-element-event="click" ani-trigger-once="true"></div>

On Dom Scroll:

<div class="anidiv" ani ani-on-dom-scroll="true" ani-class ="slideInLeft"></div>

Support or Contact

Feedback and comments are always welcome you can also report the issue at : http://github.com/hrhrprasath/NgCssAnimate/issues