这是我的代码:
/* Tile colour rotation */
/*tile 1 */
@-webkit-keyframes bwe1 {
0% {background-color: #39f;}
15% {background-color: #8bc5d1;}
30% {background-color: #f8cb4a;}
45% {background-color: #95b850;}
60% {background-color: #944893;}
75% {background-color: #c71f00;}
90% {background-color: #bdb280;}
100% {background-color: #39f;}
}
@-moz-keyframes bwe1 {
0% {background-color: #39f;}
15% {background-color: #8bc5d1;}
30% {background-color: #f8cb4a;}
45% {background-color: #95b850;}
60% {background-color: #944893;}
75% {background-color: #c71f00;}
90% {background-color: #bdb280;}
100% {background-color: #39f;}
}
/* Colour changing tiles */
.metro-layout .cycle1 {-webkit-animation: bwe1 20s infinite alternate linear; -moz-animation: bwe1 20s infinite alternate linear; }
这是我用来定义颜色旋转动画的两部分代码,但是在IE10中不起作用。但是它可以在Firefox,Safari和Chrome中运行...
请帮忙!
您还应该定义
-ms-animation: ...
和
@-ms-keyframes bwe1 { ... }
由于-webkit-
和-moz-
是特定于供应商的前缀,因此IE
可以忽略。
请注意,你也应该定义前缀的版本(animation
,@keyframes
您的代码)为较新的浏览器,如Firefox的最新版本。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句