CSS 애니메이션 라이브러리 간단하게 애니메이션 구현

퍼블리싱, 프론트, 백 어떠한 디벨롭 환경에서도 일일히 하드코딩 하기란 힘들다.

그래서 존재하는 파일과 명령의 집합인 라이브러리를 대부분의 코더들이 많이 사용한다.

대표적으로 Jquery와 AngularJS, reactJS 등 무수히 많은 라이브러리들이 존재하고

이들을 이용하면 조금 더 수월한 스크립트를 짤 수 있다.

CSS3는 애니메이션을 주기위해선 일일히 키프레임으로 애니메이션 효과를 주어야만 했다.

근데 사실상 화려한 애니메이션이 아닌 간단한 WAS환경에서의 애니메이션 효과는 정말 간단하기에

이를 코딩할 필요없이 간단한 애니메이션 효과를 적용 시키고 싶은 사람들을 위한

명령 집합 라이브러리이다.

실제로 내가 즐겨 쓰는 방법이다.

animate.css는 정말 단순한 사이트로 구성되어있다. 다운로드 링크와 개발자의 깃헙이 등재되어있고

각 애니메이션을 선택할 수 있는 항목이 Select 옵션으로 묶여져 있다.

사이트 접속은 상기 사진을 클릭하면 갈 수있다

혹여나 사진 클릭이 안되는 사용자를 배려해 따로 하이퍼링크를 걸도록 하겠다.

여기로 사이트 접속

효과는 몇개인지 모르지만 꽤 많은 양의 데이터가 저장되어있다.

원본 스타일 파일을 수정하여 애니메이션 효과를 커스터 마이징 할 수 있다.

사용법

여기를 클릭하시오.

다음엔 이를 응용하여 실 적용하는 것을 목표로 포스팅 해보도록 하겠음.

(시간 나면)