CSS3 마우스 올렸을 때 움직이는 애니메이션 배너 만들기
이번 시간에는 움직이는 배너를 만드는 방법에 대해 배웠습니다. CSS3의 Transition, Transform을 활용해서 움직이기 전 위치와 마우스를 hover 했을 때, 최종적 위치만 입력해두면 되는 간단한 방법입니다. 먼저 포토샵에서 대략적으로 위치를 한번 지정하시거나 임시로 한번 그려보세요. 마우스 올리기 전, 마우스 올린 후로 나뉘어 작업하시면 더 좋습니다. 그리고 배너에 들어가는 모든 이미지는 png 형식의 투명 이미지로 작업해 주시고 빈 공간은 포토샵의 Trim 기능을 써서 없애주시는게 핵심 입니다. 우선 여기에서 보여지게 될 움직이는 배너를 위해서 임시로 사진을 올려두도록 하겠습니다. 이렇게 세 개의 이미지를 사용할 것입니다. 각 이미지의 파일명은 표시해두었습니다. 그리고 html5, cs..