::스크롤시 애니메이션효과 라이브러리::AOS. js
@욕심쟁이
·2020. 1. 6. 10:11
반응형
AOS(Animate On Scroll Library)
페이지 스크롤을 했을 때 페이드, 회전 확대 등의 다양한 에니메이션 효과를 구현 한 라이브러리
※ IE9 지원안함 ※
https://michalsnik.github.io/aos/
AOS - Animate on scroll library
AOS Animate On Scroll Library Scroll down
michalsnik.github.io
//헤드에 아래코드 추가
<head>
<link rel="stylesheet" href="./css/aos.css" />
<script src="./js/aos.js"></script>
</head> //사용할 태그에 data-aos 추가/attribute="애니메이션 이름"
//첫번째 방법
<div id="transcroller-body" class="aos-all">
<div data-aos="fade-in" data-aos-delay="600">AOS</div>
</div>
//두번째 방법
<div data-aos="fade-in" data-aos-delay="600">AOS</div>
반응형
'IT > JavaScript' 카테고리의 다른 글
| [Javascript] 유튜브영상 반응형 삽입 방법 (0) | 2020.02.14 |
|---|---|
| [Jquery] 기능 이벤트 reset코드 (0) | 2020.01.08 |
| [javascript] a태그 선택시 특정위치로 부드럽게 가기 (0) | 2019.12.11 |
| [javascript] modal 창으로 팝업띄우기 (0) | 2019.12.11 |
| [javascript]ie9에서 틀어지는거 잡아주는 js (0) | 2019.12.11 |
