Пожалуйста, помогите мне, я не вижу ошибки. Я все пробовал. Спасибо людям. Вы можете увидеть мой код по этой ссылке.CSS3 Анимация не будет работать в Opera и Firefox, но работает в Chrome и Safari
http://jsfiddle.net/astrogastro/dFZgn/
#sun{
width: 500px;
height: 500px;
background: yellow;
background-image: url('img/sunmap.jpg');
background-repeat: repeat-x;
background-position: center;
border-radius: 50%;
background-size:1000px;
animation-name:rotateSun;
animation-duration: 6s;
animation-iteration-count: infinite;
animation-timing-function:linear;
-o-animation-name:rotateSun;
-o-animation-duration: 6s;
-o-animation-iteration-count: infinite;
-o-animation-timing-function:linear;
-moz-animation-name:rotateSun;
-moz-animation-duration: 10s;
-moz-animation-iteration-count: infinite;
-moz-animation-timing-function:linear;
-webkit-animation-name:rotateSun;
-webkit-animation-duration: 10s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function:linear;
box-shadow: 0 0 7em #FFFF4D, 0 0 0.5em #FFFF4D, 0 0 0.3em #FFFF4D;
float: left;
}
@keyframes rotateSun{
from {background-position-x:1px;}
to {background-position-x:1011px;}
}
@-o-keyframes rotateSun{
from{background-position-x:1px;}
to{background-position-x:1011px;}
}
@-moz-keyframes rotateSun{
from {background-position-x:1px;}
to {background-position-x:1011px;}
}
@-webkit-keyframes rotateSun{
from {background-position-x: 0px;}
to {background-position-x:1010px;}
}
Таким образом, он работает pefectly в Safari, есть немного заморозка в Chrome, но это нормально. Моя анимация полностью мертва в Opera и Firefox. Есть идеи?
http://www.astrogastro.byethost24.com/
Спасибо! Я исправил свой код, как это, и он работает! @ -moz-keyframes rotateSun { \t от {background-position: 1px;} \t до {background-position: 1011px;} } –