0

我正在使用以下 css3 代码进行 2d 360 度动画。它适用于所有浏览器（当然版本 < 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 回答