46 lines
1.7 KiB
JavaScript
46 lines
1.7 KiB
JavaScript
// solution-accordion.js
|
|
function toggleAccordion(header) {
|
|
const content = header.nextElementSibling;
|
|
const icon = header.querySelector('.accordion-icon');
|
|
|
|
// Переключаем только текущий аккордеон
|
|
header.classList.toggle('active');
|
|
content.classList.toggle('active');
|
|
icon.style.transform = header.classList.contains('active') ? 'rotate(180deg)' : 'rotate(0deg)';
|
|
}
|
|
|
|
// Функция для открытия всех аккордеонов
|
|
function expandAll() {
|
|
document.querySelectorAll('.accordion-content').forEach(content => {
|
|
content.classList.add('active');
|
|
});
|
|
document.querySelectorAll('.accordion-header').forEach(header => {
|
|
header.classList.add('active');
|
|
});
|
|
document.querySelectorAll('.accordion-icon').forEach(icon => {
|
|
icon.style.transform = 'rotate(180deg)';
|
|
});
|
|
}
|
|
|
|
// Функция для закрытия всех аккордеонов
|
|
function collapseAll() {
|
|
document.querySelectorAll('.accordion-content').forEach(content => {
|
|
content.classList.remove('active');
|
|
});
|
|
document.querySelectorAll('.accordion-header').forEach(header => {
|
|
header.classList.remove('active');
|
|
});
|
|
document.querySelectorAll('.accordion-icon').forEach(icon => {
|
|
icon.style.transform = 'rotate(0deg)';
|
|
});
|
|
}
|
|
|
|
// Автоматически открываем первый аккордеон в каждой карточке при загрузке
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
document.querySelectorAll('.content-card').forEach(card => {
|
|
const firstAccordion = card.querySelector('.accordion-header');
|
|
if (firstAccordion) {
|
|
toggleAccordion(firstAccordion);
|
|
}
|
|
});
|
|
}); |