У меня есть анимация CSS, с которой я сталкиваюсь, я не вижу проблемы. Есть две части: сначала «выцветать», а затем «двигаться». Часть, которая не работает, - это анимация «move». Удивительно, но полная анимация работает в Microsoft Edge, но не работает в любом другом браузере, например, в Chrome, Firefox и Opera. Может ли кто-нибудь сказать мне, где я ошибся?CSS Анимация работает только в Edge
#about {
visibility: hidden;
-webkit-animation: fadein1 .5s, move1 .5s;
-moz-animation: fadein1 .5s, move1 .5s;
-o-animation: fadein1 .5s, move1 .5s;
}
#about.open {
visibility: visible;
-webkit-animation: fadein .5s, move .5s;
-moz-animation: fadein .5s, move .5s;
-o-animation: fadein .5s, move .5s;
}
@-moz-keyframes move {
from {top: 50px;}
to {top: 0px;}
}
@-o-keyframes move {
from {top: 50px;}
to {top: 0px;}
}
@keyframes move {
from {top: 50px;}
to {top: 0px;}
}
@-webkit-keyframes move {
from {top: 50px;}
to {top: 0px;}
}
@-moz-keyframes move1 {
from {top: 0px;}
to {top: 50px;}
}
@-o-keyframes move1 {
from {top: 0px;}
to {top: 50px;}
}
@keyframes move1 {
from {top: 0px;}
to {top: 50px;}
}
@-webkit-keyframes move1 {
from {top: 0px;}
to {top: 50px;}
}
@keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
@-moz-keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
@-webkit-keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
@-o-keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
@keyframes fadein1 {
from { opacity: 1; }
to { opacity: 0; }
}
@-moz-keyframes fadein1 {
from { opacity: 1; }
to { opacity: 0; }
}
@-webkit-keyframes fadein1 {
from { opacity: 1; }
to { opacity: 0; }
}
@-o-keyframes fadein1 {
from { opacity: 1; }
to { opacity: 0; }
}
@keyframes отсутствует! пожалуйста, проверьте синтаксис .. –
Я добавил недостающие ключевые кадры, но он все тот же. –