HTML animations can either be done using css, or by using some JavaScript library such as jQuery. Given that CSS3 has inherited support for animation, using CSS is a preferred way of implementing animation in our apps. With the use of CSS3 transitions and animation constructs, we can achieve some impressive animation effects.
In AngularJS, a set of directives has been built in such a way that adding animation to these directives is easy. Directives such as ng-repeat
, ng-include
, ng-view
, ng-if
, ng-switch
, ng-class
, and ng-show
/ng-hide
have build-in support for animation.
What does it mean when we say the directive supports animation?
Well, from the CSS perspective, it implies that the previous directive dynamically adds and removes classes to the HTML element on which they are defined at specific times during directive execution. How this helps in CSS animation will be clear when we discuss CSS animation in our next section.
From a script-based animation perspective...