골

이미지를 돌려요 ~

· 2011-12-21 (수) 20:55:30 · 3309 · 1
마우스를 대면 이미지가 돌아가는 효과 입니다.

html5 에니메이션을 만들때 많이 이용 되고 있네요 ^^

초를 이미지에 맞게 설정해 주세요 ~ 

a {-webkit-transition: -webkit-transform 0.4s ease-out;-moz-transition: -moz-transform 0.4s ease-out;transition: transform 0.4s ease-out;}

a:hover{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-o-transform:rotate(360deg)}

간단하게 코드는 이렇게 됩니다.


테스트 링크 걸어 드리겠습니다 ^^

html 5 이용하시는 분들 참고 하세요 ~

ie8 이하는 되지 않습니다.
|

댓글 1개

제목이 좀 잘못되었네요 오타인듯... 아미지 -> 이미지
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

8,188건
+
제목 글쓴이 날짜 조회
12-01-11 조회 2,618
12-01-11 조회 1.2만
12-01-10 조회 2,615
12-01-08 조회 3,333
12-01-05 조회 5,226
11-12-29 조회 2,845
11-12-27 조회 2,746
11-12-25 조회 2,888
11-12-22 조회 3,193
11-12-14 조회 2,773
11-12-12 조회 3,364
11-11-28 조회 3,302
10-10-19 조회 2,771
08-09-05 조회 3,676
08-09-05 조회 3,502
08-06-14 조회 3,247
08-04-22 조회 3,518
08-04-17 조회 3,527
07-10-03 조회 4,129
07-10-03 조회 3,540
07-10-03 조회 7,207
07-10-03 조회 4,427
07-10-03 조회 3,174
07-10-03 조회 2,761
07-10-02 조회 3,508
07-10-02 조회 3,028
07-09-27 조회 4,943
07-09-27 조회 3,761
06-09-26 조회 3,454
06-09-26 조회 4,663
06-09-22 조회 3,828
06-09-22 조회 3,431
06-09-22 조회 4,169
06-09-21 조회 4,133
06-08-18 조회 3,615
05-11-30 조회 4,672
05-07-15 조회 4,527
05-03-23 조회 4,582
05-03-14 조회 3,233
05-03-13 조회 2,618
04-08-05 조회 5,701