[js library] AOS 스크롤 애니메이션 구현하기

 

 

참고

[AOS] 📚 스크롤 애니메이션 사용법 - Animate On Scroll

 

aos.css

0.02MB

aos.js

0.01MB

 

 

이번에 만들고 있는 외주 사이트에서 많이 쓰이는 애니메이션 라이브러리이다. 

이 효과 하나만으로도 웹이 한층 더 다이나믹해보여서 앞으로도 자주 쓸 것 같다. 

 

 

사진이 가운데서부터 커지는 효과 

 <div class="col-lg-6 img-bg" style="background-image: url(assets/img/2.svg);" data-aos="zoom-in" data-aos-delay="100"></div>

 

아래에서 하나씩 올라오게 

 <div class="icon-box d-flex position-relative" data-aos="fade-up" data-aos-delay="100">