Блог

Главная - Вопросы по программированию - Почему эта анимация CSS3 не будет работать в IE или Firefox?

Почему эта анимация CSS3 не будет работать в IE или Firefox?

#html #css #internet-explorer #firefox #css-animations

#HTML #css #internet-explorer #firefox #css-анимации

Вопрос:

Я использую jQuery для запуска этого класса на Flash-баннерах, и он отлично работает в Safari и Chrome, но не в Firefox или IE. jQuery работает, это просто CSS3 fade, который не работает:

 .opacityChange {
-webkit-animation: opacityChange 1s forwards;
-moz-animation: opacityChange 1s forwards;
-o-animation: opacityChange 1s forwards;
-ms-animation: opacityChange 1s forwards;
animation: opacityChange 1s forwards;
}


@-webkit-keyframes opacityChange {
0% {opacity:0;}
100% {opacity:1;}
}

@-moz-keyframes opacityChange {
0% {opacity:0;}
100% {opacity:1;}
}

@-o-keyframes opacityChange {
0% {opacity:1;}
100% {opacity:1;}
}

@-ms-keyframes opacityChange {
0% {opacity:1;}
100% {opacity:1;}
}

@keyframes opacityChange {
0% {opacity:1;}
100% {opacity:1;}
}

Комментарии:

1. Не так ли forward ? Я надеюсь, что в спецификации нет такой опечатки. РЕДАКТИРОВАТЬ: также кажется, что у вас разные значения для некоторых ключевых кадров… если это 0, а затем 1 для Chrome, почему вы хотите, чтобы это было 1, а затем 1 для IE, FF и Opera?

2. @TylerH: В спецификации это определенно означает «вперед»… :/

3. это определенно вперед. я изменил их, когда тестировал его. это не работает, когда все они одинаковы

4. @user3589485 верно, но у вас нет набора изменений для Opera, IE или Firefox (который больше не использует префикс браузера для анимации, AFAIK); у вас установлено значение «начать с непрозрачности 1», а затем перейти к непрозрачности … 1. Измените его на «начать с непрозрачности 0», и вывозможно, ваша ошибка исправлена.

5. Я это сделал, они были только на 1 и 1, когда я его тестировал. я вставил неправильный код. они вернулись к 0 1 и не работают. это то, что я только что объяснил

Метки: