Анимация WebKit на старте

Question

Я установил ключевые кадры WebKit: hover, и элемент преобразуется, как и должно быть. Обратный эффект должен быть активирован, когда пользователь удаляет курсор мыши из элемента (в основном это onmouseover и onmouseout в JS).

Итак, я создал обратные ключевые кадры и поместил их в селектор CSS по умолчанию. Проблема в том, что эти ключевые кадры активируются при загрузке страницы, но их нужно активировать только в том случае, если вы перемещаете мышь от элемента.

Есть ли какое-либо другое свойство, которое необходимо установить, или это возможно только с помощью JS?

РЕДАКТИРОВАТЬ: Вот тестовый пример JSFiddle (просмотр в WebKit, конечно): http://jsfiddle.net/nkEwQ/

Answer 1

без JS: удалено -webkit-animation-name:bouncedown; из #button,
заменил его на -webkit-transition: all .5s ease-in-out;
(не может получить хороший эффект отскока, но он оживляет обратно на площадь) http://jsfiddle.net/SebastianPataneMasuelli/nkEwQ/7/

С JS я удалил анимацию из #button, создал класс, который обрабатывает анимацию webkit (.active), и добавил этот класс при наведении курсора на кнопку, используя jQuery.

Таким образом, кнопка # не имеет анимации при загрузке, но объявления анимации добавляются в нее, когда пользователь наводит на нее курсор.

см. Здесь: http://jsfiddle.net/SebastianPataneMasuelli/nkEwQ/5/

Answer 2

JS только. Потому что нет никаких других псевдоклассов, кроме : Активный, : Фокус, :Первый ребенок, : Парить, : Языки, :ссылка на сайт, :. Посетили