0

2D360度アニメーションに次のcss3コードを使用しています。すべてのブラウザ（もちろんバージョン<10を除く）で動作しますが、Webkitで動作させることはできません。ここでわかるように、ライブの例http://www.franksdonuts.gr/mainpage/ webkit（chrome、safari）は失敗します。私のコードは次のとおりです。

@keyframes spinner {
 0% {
 -webkit-transform:rotate(0deg);
 -moz-transform:rotate(0deg);
 -ms-transform:rotate(0deg);
 -o-transform:rotate(0deg);
 transform:rotate(0deg);
}
 100% {
 -webkit-transform:rotate(360deg);
 -moz-transform:rotate(360deg);
 -ms-transform:rotate(360deg);
 -o-transform:rotate(360deg);
 transform:rotate(360deg);
}
}
.spinner {
-webkit-animation: spinner 10s infinite linear;
-moz-animation: spinner 10s infinite linear;
-ms-animation: spinner 10s infinite linear;
-o-animation: spinner 10s infinite linear;
animation: spinner 10s infinite linear;
}

IE9でもこの2D回転を実現するためのより良い解決策はありますか？

4

2 に答える 2

2

独自のキーフレーム タグを使用する必要があります。

@-moz-keyframes
@-webkit-keyframes
@-o-keyframes
于 2013-02-13T17:58:19.157 に答える
0

Greensock JS を調べましたか? それはかなり驚くべきことであり、とても便利です。

http://www.greensock.com/get-started-js/

楽しみ！

于 2013-02-13T17:58:26.870 に答える