css3 鼠标滑过背景图片,图片围绕圆心旋转的效果

鼠标滑过背景图片,图片围绕圆心旋转,鼠标移出图片就停止转动。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<style>
img{
transition:transform 0.8s;
-moz-transition: -moz-transform 0.8s; /* Firefox 4 */
-webkit-transition: -webkit-transform 0.8s; /* Safari and Chrome */
-o-transition: -o-transform 0.8s; /* Opera */
}
img:hover{
transform:rotate(180deg);
-ms-transform:rotate(180deg); /* IE 9 */
-moz-transform:rotate(180deg); /* Firefox */
-webkit-transform:rotate(180deg); /* Safari 和 Chrome */
-o-transform:rotate(180deg); /* Opera */
}
</style>