Анимация CSS: работает в Chrome, но не в Firefox?
Во вращении анимации работает в Chrome, но не в Firefox. Почему?
@-moz-keyframes rotate {
from { -moz-transform: rotate(0deg); }
to { -moz-transform: rotate(360deg); }
}
@-webkit-keyframes rotate {
from { -webkit-transform: rotate(0deg); }
to { -webkit-transform: rotate(360deg); }
}
#example {
background: red;
width: 100px;
height: 100px;
-moz-animation: rotate 20s linear 0 infinite;
-webkit-animation: rotate 20s linear 0 infinite;
}
http://jsfiddle.net/WsWWY/
Ответы
Ответ 1
Текущие реализации Firefox не выполняются, если значения времени 0
не имеют единиц. Используйте 0s
или 0ms
.
http://jsfiddle.net/WsWWY/1/
Примечание: W3C явно допускает, чтобы число 0 без единиц было значением длины, но для других значений оно не указано. Лично я надеюсь, что это изменится, но пока что поведение Firefox неверно.