Angular-animate.css is no more. Angular.js 1.2 has totally reworked the animation module.

An example of how to use animate.css in your Angular (1.2+) projects can be found here: https://plnkr.co/U1JK27T2s5nq727kygb4

Angular-animate.css WAS a collection of animation helpers for AngularJS (1.1.5) web apps.

Demo page is here: https://cdpn.io/rznBj

First of, you'll need animate.css and angular (1.1.5). When that's done, include angular-animate[.min].css after animate.css into your project.

Animate.css -> https://github.com/daneden/animate.css#attention-seekers AngularJS -> https://angularjs.org

More info on animation in AngularJS

Yearofmoo -> https://www.yearofmoo.com/2013/05/enhanced-animations-in-angularjs.html

Angular-animate is also available through bower:

bower install angular-animate.css

You can now animate the appropriate angular directives: e.g.

<div class="animated" ng-if="isVisible()" ng-animate="'fade'"></div>

This will trigger the fade animation on enter / show and leave / hide. If you only want fade on enter, you have to use

<div class="animated" ng-if="isVisible()" ng-animate="{enter: 'fade-enter'}"></div>

In and Out animations are combined, so if you use

<div class="animated" ng-if="isVisible()" ng-animate="'fadeUp'"></div>

This will trigger fadeInUp on enter and fadeOutUp on leave. If you want this differently (e.g. fadeOutDown on leave / hide), you'll have to define the enter and leave seperately.

<div class="animated" ng-if="isVisible()" ng-animate="'{enter: 'fadeUp-enter', leave: 'fadeDown-leave'}'"></div>

All of the animate.css animations are currently available.

flash bounce shake tada swing wobble wiggle pulse

flip flipInX flipOutX flipInY flipOutY

fadeIn fadeInUp fadeInDown fadeInLeft fadeInRight fadeInUpBig fadeInDownBig fadeInLeftBig fadeInRightBig

fadeOut fadeOutUp fadeOutDown fadeOutLeft fadeOutRight fadeOutUpBig fadeOutDownBig fadeOutLeftBig fadeOutRightBig

bounceIn bounceInDown bounceInUp bounceInLeft bounceInRight

bounceOut bounceOutDown bounceOutUp bounceOutLeft bounceOutRight

rotateIn rotateInDownLeft rotateInDownRight rotateInUpLeft rotateInUpRight

rotateOut rotateOutDownLeft rotateOutDownRight rotateOutUpLeft rotateOutUpRight

lightSpeedIn lightSpeedOut

hinge rollIn rollOut

• create a custom build
• daisy chaining of animations
• ...

• 2013-08-08: proper semver for bower
• 2013-07-11: v1.0.0 Bump to v1.0.0
• 2013-07-08: First public release