Question

我目前有这段代码

-webkit-transition: 0.9s;
-webkit-transform: rotate(-9deg);
-moz-transition: 0.9s;
-moz-transform: rotate(-9deg);
-o-transition: 0.9s;
-o-transform: rotate(-9deg);
-ms-transition: 0.9s;
-ms-transform: rotate(-9deg);

我希望它能让我的图像旋转到-9然后再旋转到9，然后一遍又一遍地重复。因此，当有人在现场时，它将从-9度降低到9度

编辑：我被告知要执行此操作需要JavaScript，所以我现在正在寻找一些JavaScript来执行此操作。

由于

Answer 1

您可以使用CSS animations执行此操作，具体取决于您需要的how much compatibility。

div {
    -webkit-animation-duration: 0.9s;
    -webkit-animation-name: ninetonine;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate-reverse;
    -webkit-animation-timing-function: ease-in-out;
}

@-webkit-keyframes ninetonine {
    from {
        -webkit-transform: rotate(9deg);
    }
    to {
        -webkit-transform: rotate(-9deg);
    }
}

See a demo here

自动从-9到9度旋转

1 个答案: