Как отменить возвращение элемента в исходное состояние с transition при ховере?

Question

[Саша]

Здравствуйте, подскажите пожалуйста, как отменить возвращение элемента в исходное состояние при mouseleave ?
Пример
Более подробно:
Навести курсор на элемент и тут же его убрать, а потом снова вернуть и снова убрать, в итоге заметим, что состояние элемента остается на середине этапа анимации, как сделать так, чтобы при резком повторном ховере анимация не срабатывала словно ховер задан впервые?

Спасибо.

Answer 1

[Максим Тимофеев]

.el{
  transition:none; 
  display: inline-block;
  vertical-align: top;
  background:#000;
  width: 50px;
  height: 50px;
  
  &:hover{
    width: 200px;
    transition:all 250ms ease; 
  }
}

Так?

Comments

[Саша]

Максим Тимофеев: не совсем

[Максим Тимофеев]

Саша: Чем не совсем?