AngularJS – combining JavaScript and CSS3

AngularJS has adopted the standards for animation on the Web. It embraces CSS3 Transitions, animations, and JavaScript. It's great because the developers can choose the animation option that best fits their needs. As you have already read, sometimes, one option fits better than other, so this is a great feature of ngAnimate.

With the ngAnimate module, it is far easier to animate in AngularJS because it brings a code pattern and convention that is already integrated with AngularJS native directives. This allows us—the developers and the open source community—to have a quick start to animation and a pattern to develop our custom animations. In later chapters, we will see how to integrate custom directives with AngularJS animations using the $animate service, which is the main topic of Chapter 5, Custom Directives and the $animate Service.

This is all possible due to the class-bases approach that AngularJS uses. We will see more of this in Chapter 3, Creating Our First Animation in AngularJS, when we create our first AngularJS animation.

Another advantage is that it's easy to integrate CSS animation libraries such as animate.css and Effeckt.css, as these libraries use CSS3 transitions and animations.

Check out http://daneden.github.io/animate.css/ and http://h5bp.github.io/Effeckt.css/ for CSS animations libraries.