40 lines
1.6 KiB
JavaScript
40 lines
1.6 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function() {
|
|
// Tab-Funktionalität
|
|
const tabButtons = document.querySelectorAll('.regel-tab-button');
|
|
const tabPanels = document.querySelectorAll('.regel-tab-panel');
|
|
|
|
tabButtons.forEach(button => {
|
|
button.addEventListener('click', () => {
|
|
const targetTabId = button.getAttribute('data-tab');
|
|
|
|
if (!button.classList.contains('active')) {
|
|
tabButtons.forEach(btn => btn.classList.remove('active'));
|
|
tabPanels.forEach(panel => panel.classList.remove('active'));
|
|
|
|
button.classList.add('active');
|
|
document.getElementById(targetTabId).classList.add('active');
|
|
}
|
|
});
|
|
});
|
|
|
|
// Akkordeon-Funktionalität (Regeln aufklappen)
|
|
const ruleToggles = document.querySelectorAll('.regel-toggle');
|
|
|
|
ruleToggles.forEach(toggle => {
|
|
toggle.addEventListener('click', () => {
|
|
const ruleItem = toggle.parentElement;
|
|
const wasOpen = ruleItem.classList.contains('open');
|
|
|
|
// Schließe alle anderen Regeln im selben Tab (Akkordeon-Verhalten)
|
|
const currentPanel = ruleItem.closest('.regel-tab-panel');
|
|
currentPanel.querySelectorAll('.regel-item').forEach(item => {
|
|
if (item !== ruleItem) {
|
|
item.classList.remove('open');
|
|
}
|
|
});
|
|
|
|
// Schalte den aktuellen Zustand um
|
|
ruleItem.classList.toggle('open', !wasOpen);
|
|
});
|
|
});
|
|
}); |