Jak odwrócić animację po wysunięciu myszy po najechaniu kursorem
Tak więc możliwe jest posiadanie odwróconej animacji na myszy, takiej jak:
.class{
transform: rotate(0deg);
}
.class:hover{
transform: rotate(360deg);
}
ale podczas używania animacji @keyframes nie mogłem jej uruchomić, np .:
.class{
animation-name: out;
animation-duration:2s;
}
.class:hover{
animation-name: in;
animation-duration:5s;
animation-iteration-count:infinite;
}
@keyframe in{
to {transform: rotate(360deg);}
}
@keyframe out{
to {transform: rotate(0deg);}
}
Jakie jest optymalne rozwiązanie, wiedząc, że potrzebuję iteracji i samej animacji?