Почему не работает анимация вызванная с помощью js?

Question

[NikFedoseev]

Привет! Хочу сделать анимация открытия попапа, так чтобы когда кликаешь по элементу из этого элемента вылетало модальное окошко. Проблема в том что транзишн почему то не работает в этом случае. В чем проблема?
https://jsfiddle.net/0oq62u1z/7/

Answer 1

[hesrun]

Попробуйте сделать таймаут на добавление класса.
Относительно недавно тоже встретился с такой проблемой, понял что это какой-то баг, внятного ответа не нагуглил, и костыль с таймаутом решил мою проблему.
https://codepen.io/hesrun/pen/OzJxdP - похожая ситуация...

Comments

[NikFedoseev]

Да, тоже были мысли сделать через таймаут, но думал вдруг есть более лаконичные решения. Видел еще костыль называли "инициализировать элемент" там просто после добавления класса была строка Element.offsetHeight например, тоже работало.

Answer 2

[vacoo]

Сделай анимацию через css animation. При клике добавляешь класс к элементу а там уже css-ом анимируешь