1. ¿Puedo romper sin problemas la animación CSS al pasar el mouse con CSS o JS?
2. ¿Por qué la transición no funciona después de la animación CSS?

Ejemplo:

 .button { animation: resizing 2000ms linear infinite alternate; transition: transform 200ms linear; // don't work after animation } @media (hover: hover) { .button:hover { animation: none; transform: scale(1.1); } } @keyframes resizing { 100% { transform: scale(2); } }