29 lines
1.3 KiB
JavaScript
29 lines
1.3 KiB
JavaScript
document.querySelectorAll('.accordion-trigger').forEach((btn) => {
|
|
btn.addEventListener('click', function() {
|
|
const section = btn.closest('.accordion-section');
|
|
const expanded = btn.getAttribute('aria-expanded') === "true";
|
|
document.querySelectorAll('.accordion-section').forEach(s => {
|
|
if (s === section) {
|
|
s.classList.toggle('open', !expanded);
|
|
btn.setAttribute('aria-expanded', String(!expanded));
|
|
const content = btn.nextElementSibling;
|
|
content.style.maxHeight = !expanded ? (content.scrollHeight+40) + "px" : "0px";
|
|
} else {
|
|
s.classList.remove('open');
|
|
s.querySelector('.accordion-trigger').setAttribute('aria-expanded', "false");
|
|
s.querySelector('.accordion-content').style.maxHeight = "0px";
|
|
}
|
|
});
|
|
});
|
|
|
|
btn.addEventListener('keydown', function(e) {
|
|
if (e.key === "ArrowDown" || e.key === "ArrowUp") {
|
|
const triggers = Array.from(document.querySelectorAll('.accordion-trigger'));
|
|
let idx = triggers.indexOf(e.target);
|
|
if (e.key === "ArrowDown") idx = (idx + 1) % triggers.length;
|
|
else idx = (idx - 1 + triggers.length) % triggers.length;
|
|
triggers[idx].focus();
|
|
}
|
|
});
|
|
});
|