47 lines
1.8 KiB
JavaScript
47 lines
1.8 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function() {
|
|
|
|
// === FAQ TABS FUNKTIONALITÄT ===
|
|
const tabButtons = document.querySelectorAll('.faq-tab-button');
|
|
const tabPanes = document.querySelectorAll('.faq-tab-pane');
|
|
|
|
tabButtons.forEach(button => {
|
|
button.addEventListener('click', () => {
|
|
// 1. Aktive Klassen von allen Buttons und Panes entfernen
|
|
tabButtons.forEach(btn => btn.classList.remove('active'));
|
|
tabPanes.forEach(pane => pane.classList.remove('active'));
|
|
|
|
// 2. Aktive Klasse zum geklickten Button hinzufügen
|
|
button.classList.add('active');
|
|
|
|
// 3. Den zugehörigen Inhalt (Pane) finden und aktivieren
|
|
const targetCategory = button.getAttribute('data-category');
|
|
const targetPane = document.querySelector(`.faq-tab-pane[data-category="${targetCategory}"]`);
|
|
if (targetPane) {
|
|
targetPane.classList.add('active');
|
|
}
|
|
});
|
|
});
|
|
|
|
|
|
// === FAQ AKKORDEON FUNKTIONALITÄT (bleibt unverändert) ===
|
|
const faqItems = document.querySelectorAll('.faq-item');
|
|
|
|
faqItems.forEach(item => {
|
|
const question = item.querySelector('.faq-question');
|
|
const answer = item.querySelector('.faq-answer');
|
|
|
|
if (question && answer) {
|
|
question.addEventListener('click', () => {
|
|
// 'active' Klasse zum aktuellen Item togglen
|
|
const isActive = item.classList.toggle('active');
|
|
|
|
// Höhe der Antwort anpassen für smooth slide
|
|
if (isActive) {
|
|
answer.style.maxHeight = answer.scrollHeight + 'px';
|
|
} else {
|
|
answer.style.maxHeight = null;
|
|
}
|
|
});
|
|
}
|
|
});
|
|
}); |