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

Question

[lavezzi1]

Всем привет. Есть панель которая должна выезжать справа. Написал анимацию, но - работает только один раз, а второй и последующие разы просто появляется без анимации, вот код:

animation-name: popup_from_right;
  animation-duration: 0.2s;
  animation-timing-function: ease-out;
  animation-fill-mode: forwards;


@keyframes popup_from_right {
    0%
    {
        opacity: 0;

        transform: translateX(100%);
    }

    100%
    {
        opacity: 1;

        transform: translateX(0);
    }
}

В чем проблема?

Answer 1

[Роман Родионов]

У css анимация тоже есть события. Тебе нужно при клике удалить класс анимации у элемента, а потом присвоить заново.

Answer 2

[frontender]

https://css-tricks.com/restart-css-animation/ почитайте, пожалуйста.