111 lines
4.3 KiB
JavaScript
111 lines
4.3 KiB
JavaScript
// -----------------------------------------HEADER-----------------------------------------------------------
|
||
const headers = document.querySelectorAll('.header_top_item');
|
||
if(headers.length > 0) {
|
||
headers[0].classList.add('active');
|
||
}
|
||
document.querySelectorAll('.header_top_item').forEach((item) => {
|
||
|
||
item.addEventListener('click', (e) => {
|
||
e.preventDefault(); // если не нужно переходить со страницы
|
||
document.querySelectorAll('.header_top_item').forEach(el => el.classList.remove('active'));
|
||
item.classList.add('active');
|
||
});
|
||
});
|
||
|
||
// -------------------------------ACCORDION-SLIDER-----------------------------------------------------------
|
||
|
||
const items = document.querySelectorAll('.accordion-item');
|
||
|
||
// Делаем первый аккордеон активным по умолчанию
|
||
if(items.length > 0) {
|
||
items[0].classList.add('active');
|
||
}
|
||
|
||
// items.forEach(item => {
|
||
// item.addEventListener('click', () => {
|
||
// items.forEach(i => i.classList.remove('active'));
|
||
// item.classList.add('active');
|
||
// });
|
||
// });
|
||
// код ниже если нужно картинку на открытую и закрытую колонку(ток классы добавь в html и картинки по 2 или че там придумаешь)
|
||
items.forEach(item => {
|
||
item.addEventListener('click', () => {
|
||
items.forEach(i => {
|
||
i.classList.remove('active');
|
||
i.querySelector('.img-open').style.display = 'none';
|
||
i.querySelector('.img-closed').style.display = 'block';
|
||
});
|
||
|
||
item.classList.add('active');
|
||
item.querySelector('.img-open').style.display = 'block';
|
||
item.querySelector('.img-closed').style.display = 'none';
|
||
});
|
||
});
|
||
|
||
// -----------------------------------------ACCORDION-SECOND----------------------------------------------
|
||
document.addEventListener('DOMContentLoaded', () => {
|
||
const cards = document.querySelectorAll('.advantage_slider_item');
|
||
|
||
cards.forEach(card => {
|
||
card.addEventListener('click', () => {
|
||
// если уже активна — просто закрываем
|
||
if (card.classList.contains('active')) {
|
||
card.classList.remove('active');
|
||
} else {
|
||
// иначе закрываем все остальные и открываем текущую
|
||
cards.forEach(c => c.classList.remove('active'));
|
||
card.classList.add('active');
|
||
}
|
||
});
|
||
});
|
||
});
|
||
|
||
// ----------------------------------------------------------ВЫПАДАЮЩЕЕ-МЕНЮ--------------------------------------------------------
|
||
|
||
document.querySelector('.header_nav_link-reverse').addEventListener('click', function() {
|
||
const dropdown = document.querySelector('.dropdown-list');
|
||
const text = this.querySelector('.link-text');
|
||
|
||
dropdown.classList.toggle('show');
|
||
|
||
// Меняем текст кнопки
|
||
if (dropdown.classList.contains('show')) {
|
||
text.textContent = 'Меньше услуг';
|
||
} else {
|
||
text.textContent = 'Больше услуг';
|
||
}
|
||
});
|
||
|
||
// -------------------------------------BURGER-MENU-TOP-----------------------------------------------------------------------------------
|
||
|
||
document.addEventListener('DOMContentLoaded', () => {
|
||
const burgerBtn = document.querySelector('.burger_menu_btn');
|
||
const navWrapper = document.querySelector('.header_top_wrapper-open');
|
||
const navMenu = navWrapper.querySelector('.header_nav_top');
|
||
|
||
burgerBtn.addEventListener('click', () => {
|
||
navMenu.classList.toggle('active');
|
||
burgerBtn.classList.toggle('active');
|
||
document.body.classList.toggle('lock'); // блокируем скролл при открытом меню
|
||
});
|
||
|
||
// при клике по ссылке меню закрываем бургер
|
||
navWrapper.querySelectorAll('.header_top_link').forEach(link => {
|
||
link.addEventListener('click', () => {
|
||
navMenu.classList.remove('active');
|
||
burgerBtn.classList.remove('active');
|
||
document.body.classList.remove('lock');
|
||
});
|
||
});
|
||
});
|
||
|
||
// -----------------------------------------BURGER-MENU-----------------------------------------------------------------
|
||
|
||
document.addEventListener("DOMContentLoaded", () => {
|
||
const toggleBtn = document.querySelector(".top_list_btn");
|
||
const menu = document.querySelector(".header_nav_burger");
|
||
|
||
toggleBtn.addEventListener("click", () => {
|
||
menu.classList.toggle("open");
|
||
});
|
||
}); |