Antoine/carhop__carhop-theme__DEV
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

FEATURE Improve submenu handling and accessibility in header navigation

Browse Source
This commit is contained in:
Antoine M 2026-01-30 10:16:45 +01:00
parent 0966e97b6c
commit ae5bb850de
1 changed files with 17 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
resources/js/header.js
View File

@ -5,7 +5,12 @@ export default function menuInit() {
const burgerMenuToggle = header.querySelector('#burger-menu-toggle'); const burgerMenuToggle = header.querySelector('#burger-menu-toggle');
const submenuToggles = header.querySelectorAll('.menu-item__submenu-toggle'); const submenuToggles = header.querySelectorAll('.menu-item__submenu-toggle');
console.log(submenuToggles); function closeSubmenus(e) {
submenuToggles.forEach((button) => {
button.setAttribute('aria-expanded', false);
button.parentElement.querySelector('.sub-menu').classList.remove('sub-menu-open');
});
}
// #### Open/close burger nav // #### Open/close burger nav
// burgerMenuToggle.addEventListener('click', function (e) { // burgerMenuToggle.addEventListener('click', function (e) {
@ -41,9 +46,18 @@ export default function menuInit() {
submenuToggles.forEach((button) => { submenuToggles.forEach((button) => {
button.addEventListener('click', function (e) { button.addEventListener('click', function (e) {
let isExpanded = button.getAttribute('aria-expanded') === 'true'; let isExpanded = button.getAttribute('aria-expanded') === 'true';
button.setAttribute('aria-expanded', !isExpanded);
button.parentElement.querySelector('.sub-menu').classList.toggle('sub-menu-open'); closeSubmenus(e);
if (!isExpanded) {
button.setAttribute('aria-expanded', true);
button.parentElement.querySelector('.sub-menu').classList.add('sub-menu-open');
}
}); });
}); });
document.addEventListener('keydown', function (e) {
if (e.key === 'Escape') {
closeSubmenus(e);
}
});
} }