CSS3 animation를 이용한 이미지 움직이기

CSS3 animation으로 이미지를 상하로 움직이기!!!

소스보러가기 !!

추가 설명)

animation: myfirst 0.7s linear 1s infinite alternate;

@keyframes myfirst {

    0%   {opacity: 1.0; top:15px;}

    100% {opacity: 1.0; top:0px;}

}

여기에서 myfirst라는 것은 애니메이션 이름임.

키프레임에서 애니메이션 이름을 동일하게 사용해주면 해당 애니메이션이 작동하게 됨.

애니메이션 이름은 사용자가 정할 수 있음.

w3schools 상세 설명 보기