Привет всем
Сделал анимированную иконку svg в js , при наведении на красный блок добавляются классы с анимацией, если убрать курсор классы удаляются.
Проблема в том, что длительность анимации примерно 2.8 сек,
если курсор навести и сразу убрать, то анимация не успевает закончиться.
Если в a.onmouseover = setTimeout( function(e) { ... }, 4000)
Анимация заканчивается и после того как убрать курсор, но классы не удаляются...
Помогите пожалуйста решить проблемку:
1) надо сделать так, чтобы классы удалялись после того, как убрали курсор, но и при этом чтобы анимация успела закончиться
2) Как сделать чтобы при наведении на блок, иконка не выводилась сразу, а выводилась постепенно? с отрисовкой анимации
https://codepen.io/Zhelezniy/pen/KKmPrpJ 
