Getting Started with CSS-based Animations

AngularJS 1    |    Intermediate
  • 13 Videos | 1h 2m 25s
  • Earns a Badge
Likes 14 Likes 14
Animation can enhance both your web application and the user's experience. Learn how to implement CSS-based animation in AngularJS, including how to use animation libraries such as animate.css within your applications.

WHAT YOU WILL LEARN

  • add the ngAnimate module as a dependency in an AngularJS application
    create, enter, and leave transition animations for AngularJS directives such as, ngInclude, ngView, ngIf, ngSwitch
    ensure that transition animations for nested directives work as expected
    animate ngRepeat items entering and leaving the DOM
    create a move transition animation for the AngularJS directive ngRepeat
    create, add, and remove animations for AngularJS directive such as ng-show, ng-hide, and ng-class
    animate the ngHide and ngShow directives in AngularJS
  • create animations that run when Angular performs form validation
    create animations for the AngularJS directive ngMessages
    use CSS keyframe animations in AngularJS
    use CSS animation libraries in AngularJS
    add support for AngularJS animation to a custom directive
    work with promises returned by the methods in the $animate service

IN THIS COURSE

  • Playable
    1. 
    Adding ngAnimate
    4m 20s
    UP NEXT
  • Playable
    2. 
    Enter and Leave Animations
    4m 26s
  • Locked
    3. 
    Working with Child Animations
    4m 37s
  • Locked
    4. 
    Entering and Leaving with ngRepeat
    6m 24s
  • Locked
    5. 
    Move Animations with ngRepeat
    3m 21s
  • Locked
    6. 
    Add and Remove Animations with ngClass
    5m 3s
  • Locked
    7. 
    Animating ngHIde and ngShow
    4m 33s
  • Locked
    8. 
    Animating Form Validation
    4m 13s
  • Locked
    9. 
    Animating Forms and ngMessages
    4m 36s
  • Locked
    10. 
    Using CSS Keyframe Animations
    7m 29s
  • Locked
    11. 
    Using CSS Animation Libraries
    4m 20s
  • Locked
    12. 
    Animating a Custom Directive
    4m 33s
  • Locked
    13. 
    Working with $animate Promises
    3m 1s

EARN A DIGITAL BADGE WHEN YOU COMPLETE THIS COURSE

Skillsoft is providing you the opportunity to earn a digital badge upon successful completion of this course, which can be shared on any social network or business platform

Digital badges are yours to keep, forever.

YOU MIGHT ALSO LIKE

Likes 2 Likes 2  
CHANNEL MEAN.js
Likes 3 Likes 3