переделал меню pc на ul

This commit is contained in:
Kirill Pet
2024-12-23 16:12:24 +03:00
parent d272e126ad
commit a68e12af2f
3 changed files with 136 additions and 120 deletions

View File

@@ -163,51 +163,31 @@ function howPhone() {
// how end
// phone menu
let btnOpenMenu = document.querySelector('.button-menu__open');
let listMenu = document.querySelectorAll('.header-menu__list > li');
btnOpenMenu.onclick = function () {
let phoneMenu = document.querySelector('.phone-menu'),
block = document.querySelector('.phone-menu__block-content.main'),
content = document.querySelector('.phone-menu__content.main'),
newHeigh = content.offsetHeight + 'px';
listMenu.forEach(li => {
if (li.querySelector('.header-menu-list__next')) {
let nextButton = li.querySelector('.header-menu-list__next'),
sub = li.querySelector('.header-menu-list__sub');
phoneMenu.classList.add('active');
// block.classList.add('active');
block.style.height = newHeigh;
}
nextButton.addEventListener('mouseover', function (event) {
let openSubMenu = document.querySelector('.header-menu-list__sub.open');
let closeMainMenu = document.querySelector('.phone-menu-content__close.main');
if (openSubMenu) {
openSubMenu.classList.remove('open');
}
closeMainMenu.onclick = function () {
let phoneMenu = document.querySelector('.phone-menu'),
block = document.querySelector('.phone-menu__block-content.main'),
content = document.querySelector('.phone-menu__content.main');
sub.classList.add('open');
})
phoneMenu.classList.remove('active');
block.style.height = 0;
}
let nextPhoneMenu = document.querySelectorAll('.phone-menu--next');
nextPhoneMenu.forEach(next => {
next.onclick = function () {
let subName = next.dataset.menu,
blockSub = document.querySelector(`.phone-menu__sub.${subName}`);
blockSub.classList.add('active');
}
sub.addEventListener('mouseout', function (event) {
if (event.relatedTarget.offsetParent.tagName != 'UL') {
sub.classList.remove('open');
}
})
};
})
let subPhone = document.querySelectorAll('.phone-menu__sub');
subPhone.forEach(menu => {
let close = menu.querySelector('.phone-menu-content__close');
close.onclick = function () {
menu.classList.remove('active');
}
})
// phone menu end
// search