Firefox中的CSS动画问题

时间:2014-10-02 13:04:20

标签: css3 css-animations

我有一个小提琴,它是我们工作中某个产品的复制品。它在Chrome和IE中工作,但不是firefox,我已经盯了一会儿,看不出任何原因。我希望这会引起脑波。

它似乎在Firefox中显示为透明色,小提琴显示Chrome和IE中的值。

干杯, Ĵ

http://jsfiddle.net/qb9unwmh/2/

body {
 background: #ff0000;
-webkit-backface-visibility: hidden;
-webkit-animation-duration: 1s;
-webkit-animation-name: taskUrgent;
-webkit-animation-iteration-count: infinite;
-webkit-animation-direction: alternate;
-moz-animation-duration: 1s;
-moz-animation-name: taskUrgent;
-moz-animation-iteration-count: infinite;
-moz-animation-direction: alternate;
backface-visibility: hidden;
animation-duration: 1s;
animation-name: taskUrgent;
animation-iteration-count: infinite;
animation-direction: alternate;
}

@-webkit-keyframes taskUrgent {
  0% {
    background: -webkit-linear-gradient(top, #ff0000 0, #8c0000 100%);
 }
100% {
   background: -webkit-linear-gradient(top, #8c0000 0, #510000 100%);
 }
}

@-moz-keyframes taskUrgent {
  0% {
    background: -moz-linear-gradient(top, #ff0000 0, #8c0000 100%);
  }
  100% {
   background: -moz-linear-gradient(top, #8c0000 0, #510000 100%);
   }
}

@keyframes taskUrgent {
   0% {
     background: linear-gradient(to bottom, #ff0000 0%, #8c0000 100%);
  }
  100% {
       background: linear-gradient(to bottom, #8c0000 0%, #510000 100%);
  }
}

0 个答案:

没有答案