Какой псевдокласс выбрать?

Question

[karinasorokina]

У меня есть анимация, я хочу, чтобы когда я нажала на нижнюю панель анимация произошла. active не подходит, ибо по задумке анимация должна начинаться после 1 клика и заканчиваться, независимо от подальших действий
https://codepen.io/IninsayY/pen/VwLEPvz (обратить внимание на 30-35 строчки css)

Answer 1

[v3shin]

Вариант с js: при клике добавлять элементу класс и анимировать этот класс.
Вариант с css: переделать через label, добавить внутрь label скрытый checkbox (или radio) и анимировать элемент после этого checkbox'а: label input[type="checkbox"]:checked + .myClass{}

Comments

[karinasorokina]

Спасибо! Не могли бы вы указать на проблему?

<div onclick="document.getElementsByClassName('contacts-menu')[0].style.animation-play-state = 'running';" class="contacts-menu">

[v3shin]

<div onclick="this.classList.add('contacts-menu__animated')" class="contacts-menu">

Скорее, так. И уже для .contacts-menu.contacts-menu__animated прописываете в css анимацию.
Ну, и по возможности избавляетесь от атрибута onclick.