CSS3 moz-kit动画

时间:2012-06-15 01:38:58

标签: html css html5 css3

我有这个在Chrome中运行的CSS3动画

 .circle-label-rotate {
                -webkit-animation-name: rotateThis;
                -webkit-animation-duration:.5s;
                -webkit-animation-iteration-count:infinite;
                -webkit-animation-timing-function:linear;
            }

现在,如何使用Mozilla Firefox - 我认为使用keyframes。但我一直在犯错误。您如何处理上述代码的Firefox等效项?

我试过这个:

-moz-animation-duration: 3s;
-webkit-animation-duration: 3s;
-moz-animation-name: slidein;
-webkit-animation-name: slidein;

2 个答案:

答案 0 :(得分:3)

添加-moz-前缀。

-moz-animation-name: rotateThis;
-moz-animation-duration:.5s;
-moz-animation-iteration-count:infinite;  
-moz-animation-timing-function:linear;

@-moz-keyframes rotateThis 
{ Some css. }

答案 1 :(得分:0)

  • 扩展名-webkit-适用于Chrome和Safari
  • -moz-可以在Mozilla Firefox中使用
  • -o-可以在Opera中使用
  • -ms-可以在IE中工作(但我不确定它是否支持)