.img {
width: 100px;
height: 100px;
animation: move 3s 0s infinite;
-webkit-animation: move 3s 0s infinite;
transform-origin: bottom;
-webkit-transform-origin: bottom;
}
@keyframes move {
0%,
65% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
70% {
-webkit-transform: rotate(6deg);
transform: rotate(6deg);
}
75% {
-webkit-transform: rotate(-6deg);
transform: rotate(-6deg);
}
80% {
-webkit-transform: rotate(6deg);
transform: rotate(6deg);
}
85% {
-webkit-transform: rotate(-6deg);
transform: rotate(-6deg);
}
90% {
-webkit-transform: rotate(6deg);
transform: rotate(6deg);
}
95% {
-webkit-transform: rotate(-6deg);
transform: rotate(-6deg);
}
100% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
}
CSS_左右间歇晃动效果
最新推荐文章于 2022-12-16 15:48:13 发布