Привет, у меня есть анимация, которая показывает боковое меню. Для отслеживания состояния меню я использую классы. При открытие меню я добавляю класс side_menu_open, при закрытии я удаляю класс side_menu_open и добавляю класс side_menu_close, но при 2 открытии бокового меню после окончания анимации меню закрывается, класс остается side_menu_open, но свойство display становится none.
Кусок кода отвечающий за скрытие меню:
const hideSideMenu = () => {
var shadowZone = document.getElementById('shadowZone');
shadowZone.classList.remove('side_menu_open');
shadowZone.classList.add('side_menu_close');
if(shadowZone.classList.value == 'side_menu_close'){
document.getElementsByClassName('side_menu_close')[0].addEventListener('animationend', () => {
shadowZone.style.display = 'none';
});
}
}
Кусок кода отвечающий за открытие бокового меню
const showModal = () => {
var shadowZone = document.getElementById('shadowZone');
var anim_active = document.getElementsByClassName('side_menu_close')[0];
if(anim_active) {
anim_active.removeEventListener('animationend', ()=>{}, false);
shadowZone.classList.remove('side_menu_close');
}
shadowZone.classList.add('side_menu_open');
shadowZone.style.display = 'block';
}
