[javascript] [aos] 애니매이션 효과 적용하기

// 라이브러리 삽입
< link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
< script src="https://unpkg.com/aos@next/dist/aos.js">< /script>

// 실행
AOS.init();

/* 위쪽으로 페이드 효과 */
< div data-aos="fade-up">< /div>

/* 아래쪽으로 페이드 효과 */
< div data-aos="fade-down">< /div>

/* 오른쪽으로 페이드 효과 */
< div data-aos="fade-right">< /div>

/* 왼쪽으로 페이드 효과 */
< div data-aos="fade-left">< /div>

/* 왼쪽으로 플립 효과 */
< div data-aos="flip-left">< /div>

/* 오른쪽으로 플립 효과 */
< div data-aos="flip-right">< /div>

/* 위쪽으로 플립 효과 */
< div data-aos="flip-up">< /div>

/* 아래쪽으로 플립 효과 */
< div data-aos="flip-down">< /div>

/* 줌 효과 */
< div data-aos="zoom-in">< /div>