создал addClosePhoneMenu для создания кнопки в меню для телефона

This commit is contained in:
Kirill Pet
2024-12-24 12:35:52 +03:00
parent 9ec0db852e
commit 5bb2a18ae3
3 changed files with 13 additions and 37 deletions

View File

@@ -142,7 +142,7 @@
.phone-menu__sub.open{
left: 0;
}
.phone-menu__sub li:nth-child(2) a{
.phone-menu__sub > li:nth-child(2) a{
font-weight: 700;
font-size: 32px;
}

View File

@@ -163,6 +163,9 @@ function howPhone() {
// how end
// phone menu
addClosePhoneMenu('.phone-menu__content');
addClosePhoneMenu('.phone-menu__sub');
let btnOpenMenu = document.querySelector('.button-menu__open');
btnOpenMenu.onclick = function () {
let block = document.querySelector('.phone-menu'),
@@ -201,39 +204,17 @@ phoneList.forEach(list => {
})
})
function addClosePhoneMenu(classAdd) {
document.querySelectorAll(classAdd).forEach(element => {
let button = document.createElement('button');
button.className = "phone-menu-content__close";
// let closeMainMenu = document.querySelector('.phone-menu-content__close.main');
let referenceElement = element.firstElementChild;
// closeMainMenu.onclick = function () {
// let phoneMenu = document.querySelector('.phone-menu'),
// block = document.querySelector('.phone-menu__block-content.main'),
// content = document.querySelector('.phone-menu__content.main');
// 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');
// }
// })
// 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');
// }
// })
console.log(element.insertBefore(button, referenceElement));
})
}
// phone menu end
// search

View File

@@ -258,8 +258,6 @@
<div class="phone-menu">
<div class="phone-menu__content">
<button class="phone-menu-content__close"></button>
<ul class="phone-menu__list">
<li>
<a href="#">спецификация</a>
@@ -268,15 +266,12 @@
<li>
<a href="#" class="phone-menu--next" data-menu="catalog">каталог</a>
<ul class="phone-menu__sub phone-menu__list">
<button class="phone-menu-content__close"></button>
<li>
<a href="#">Каталог</a>
</li>
<li>
<a href="#" class="phone-menu--next">Кардио</a>
<ul class="phone-menu__sub phone-menu__list">
<button class="phone-menu-content__close"></button>
<li>
<a href="#">Кардио</a>
</li>