사용 가능한 애니메이션 속성

• 
  Fade animations
  >
  
  
  • fade
  
  
  • fade-up
  
  
  • fade-down
  
  
  • fade-left
  
  
  • fade-right
  
  
  • fade-up-right
  
  
  • fade-up-left
  
  
  • fade-down-right
  
  
  • fade-down-left
  
  
  >
  



• 
  Flip animations
  >
  
  
  • flip-up
  
  
  • flip-down
  
  
  • flip-left
  
  
  • flip-right
  
  
  >
  



• 
  Slide animations
  >
  
  
  • slide-up
  
  
  • slide-down
  
  
  • slide-left
  
  
  • slide-right
  
  
  >
  



• 
  Zoom animations
  >
  
  
  • zoom-in
  
  
  • zoom-in-up
  
  
  • zoom-in-down
  
  
  • zoom-in-left
  
  
  • zoom-in-right
  
  
  • zoom-out
  
  
  • zoom-out-up
  
  
  • zoom-out-down
  
  
  • zoom-out-left
  
  
  • zoom-out-right
  
  
  >
  

애니메이션 효과 세부 설정

• 
  위치, 애니메이션 속도, 지속 시간 등을 세세하게 정하고 싶다면 다음처럼 속성을
  추가합니다.
  


• 
  스크롤해서 밑으로 내리면 요소가 애니메이션 효과와 함께 나타납니다.
  


• delay와 duration은 0부터 3000까지 가능하고, 50 단위로 설정합니다.

<div data-aos="fade-up"
     data-aos-offset="200"
     data-aos-delay="50"
     data-aos-duration="1000"
     data-aos-easing="ease-in-out"
     data-aos-mirror="true"
     data-aos-once="false"
     data-aos-anchor-placement="top-center">
</div>