4

css3アニメーションと変換プロパティ(20度から-20度)で要素を回転させたい

@-moz-keyframes oneRotate{
    0%{
        -moz-transform: rotate(20deg);
    }
    100%{
        -moz-transform:rotate(-20deg);
    }
}

.oneRotate
{
    -moz-transform-style: preserve-3d;

   -moz-animation-name:oneRotate;
   -moz-animation-duration:2s;
   -moz-animation-timing-function:ease-in-out;
   -moz-animation-delay:0s;
   -moz-animation-iteration-count:infinite;
   -moz-animation-direction:normal;
}

回転順序は20->0->-20...は反時計回りです

しかし、私は順序が20-> 90->180->...時計回りであることを望みます

それを達成するために私は何ができますか?

4

1 に答える 1

4

100%回転角を340度に設定します。-20 + 360 = 340なので-20度と同じ角度ですが、340> 20、-20 <20なので、反対方向に回転します。

于 2012-05-06T18:38:40.980 に答える