Поддержание конечного состояния в конце анимации CSS3
Я запускаю анимацию для некоторых элементов, которые установлены вopacity: 0;
в CSS. Класс анимации применяется к onClick, и, используя ключевые кадры, он изменяет прозрачность с0
в1
(между прочим).
К сожалению, когда анимация заканчивается, элементы возвращаются кopacity: 0
(как в Firefox, так и в Chrome). Мое естественное мышление состояло бы в том, что анимированные элементы поддерживают конечное состояние, переопределяя их исходные свойства. Это не правда? И если нет, как я могу получить элемент для этого?
Код (префиксные версии не включены):
@keyframes bubble {
0% { transform:scale(0.5); opacity:0.0; }
50% { transform:scale(1.2); opacity:0.5; }
100% { transform:scale(1.0); opacity:1.0; }
}