AngularJS

Animations

1. Animations
2. ngAnimate
3. How to use AngularJS with ngAnimate
4. CSS Class Names
5. CSS Transition
6. CSS-based Animations
7. CSS Class-based Animations
8. CSS Animation
9. CSS Keyframe
10. CSS Keyframe Animation

• Animations
  • AngularJS 1.3 이후 버전부터
  • animation이 directive의 형태로 기본 제공
  • 예를 들면
    • ngRepeat
    • ngSwitch
    • ngView
  • 나만의 애니메이션을 만들고 싶다면?
    • $animation 을 사용해서 구현 가능

Animations

•  Installation
  • Include ‘angular-animate.js’
  • Load the module

ngAnimate

• ngAnimate module
  • keyframes and transitions
  • Support for CSS-based animations

•  Installation
  • Include ‘angular-animate.js’
  • Load the module

•  Installation
  • Include ‘angular-animate.js’
  • Load the module

•  Installation
  • Include ‘angular-animate.js’
  • Load the module