css3图片抖动效果
来源:动视网
责编:小采
时间:2020-11-27 18:53:23
css3图片抖动效果
css3图片抖动效果:@-moz-keyframes tada{ 0%{-moz-transform:scale(1);} 10%,20%{-moz-transform:scale(0.9) rotate(-3deg);} 30%,50%,70%,90%{-moz-transform:scale(1.2) rotate(3deg);} 40%,60%,80%{-moz-transform:scale(1.2) rotate(-3deg);} 100%{-moz-transform:scale(1)
导读css3图片抖动效果:@-moz-keyframes tada{ 0%{-moz-transform:scale(1);} 10%,20%{-moz-transform:scale(0.9) rotate(-3deg);} 30%,50%,70%,90%{-moz-transform:scale(1.2) rotate(3deg);} 40%,60%,80%{-moz-transform:scale(1.2) rotate(-3deg);} 100%{-moz-transform:scale(1)

@-moz-keyframes tada{
0%{-moz-transform:scale(1);}
10%,20%{-moz-transform:scale(0.9) rotate(-3deg);}
30%,50%,70%,90%{-moz-transform:scale(1.2) rotate(3deg);}
40%,60%,80%{-moz-transform:scale(1.2) rotate(-3deg);}
100%{-moz-transform:scale(1) rotate(0);}
}
@-webkit-keyframes tada{
0%{-webkit-transform:scale(1);}
10%,20%{-webkit-transform:scale(0.9) rotate(-3deg);}
30%,50%,70%,90%{-webkit-transform:scale(1.2) rotate(3deg);}
40%,60%,80%{-webkit-transform:scale(1.2) rotate(-3deg);}
100%{-webkit-transform:scale(1) rotate(0);}}
.doudun:hover{
-webkit-animation: tada 1s .2s ease both;
-moz-animation: tada 1s .2s ease both;
}
更多css3 图片 抖动效果相关文章请关注PHP中文网!
css3图片抖动效果
css3图片抖动效果:@-moz-keyframes tada{ 0%{-moz-transform:scale(1);} 10%,20%{-moz-transform:scale(0.9) rotate(-3deg);} 30%,50%,70%,90%{-moz-transform:scale(1.2) rotate(3deg);} 40%,60%,80%{-moz-transform:scale(1.2) rotate(-3deg);} 100%{-moz-transform:scale(1)