nastya97core
@nastya97core
Начинающий программист

Почему при удалении и добавлении класса css анимация не повторяется?

Здравствуйте. Почему анимация не повторяется при каждом нажатии? И как сделать, чтоб анимация повторилась?


В жизни у меня немного другая картина:
Есть форма и есть валидация полей на js. При нажатии на отправку формы, поля, которые не прошли валидацию должны быть анимированы. При повтором нажатии, анимация должна повториться. И в итоге у меня после нажатие на отправку формы удаляется класс, затем валидация и класс снова добавляется, однако анимации нет...
  • Вопрос задан
  • 132 просмотра
Решения вопроса 1
mlnkv
@mlnkv
JavaScript Developer
const button = document.querySelector("button");
const target = document.querySelector("h1");
button.addEventListener("click", () => {
  target.classList.remove("error");  
  setTimeout(() => {
    target.classList.add("error");
  }, 0);
});


.error {
  animation: shake 350ms backwards ease-in-out;
  color: red;  
}
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
iiiBird
@iiiBird Куратор тега CSS
Пока ты спишь - твой конкурент совершенствуется
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы