обратный svg анимация при наведении завершена?

Question

Я просто хочу, чтобы мои строки svg изменили их анимацию после того, как пользователь перестает зависать над родительским переключателем div.

Существует достаточное количество коды, так что я только что сделал jsbin:

http://jsbin.com/tiwejekicu/2/edit

Так что мой вопрос: как я могу заставить его действовать, как и любой старый переход и обратные себя, когда парение является над. ТАКЖЕ: как получится, когда желтая коробка нажата, синее затухание происходит от левого края? Есть идеи?! Большое спасибо за любую помощь!

Answer 1

Вы должны иметь два @keyframe правила:

@keyframe in { 
from {something;} 
to {to something;} 
} 
@keyframe out { 
from {something;} 
to {transform: rotate(0deg);} 
} 

Отъезд this question это в основном то же самое.