manuelcillero/pagetop
manuelcillero/pagetop
1
0
Fork 0
Code Issues Pull requests 1 Projects Releases Packages Wiki Activity Actions

🚸 Improve menu on links opening in new window

Browse source
This commit is contained in:
Manuel Cillero 2024-03-02 22:06:28 +01:00
parent f528c55dc3
commit 7f82151cce
1 changed files with 24 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

32
static/base/js/menu.js
View file

@ -13,7 +13,7 @@ function menu__hideChildren(nav, children) {
submenu.style.animation = 'slideRight 0.5s ease forwards'; submenu.style.animation = 'slideRight 0.5s ease forwards';
setTimeout(() => { setTimeout(() => {
submenu.classList.remove('active'); submenu.classList.remove('active');
submenu.style.removeProperty("animation"); submenu.style.removeProperty('animation');
}, 300); }, 300);
children.shift(); children.shift();
@ -31,13 +31,17 @@ function menu__toggle(nav, overlay) {
overlay.classList.toggle('active'); overlay.classList.toggle('active');
} }
function menu__reset(menu, nav) { function menu__reset(menu, nav, overlay) {
menu__toggle(nav, overlay);
setTimeout(() => {
nav.querySelector('.menu__header').classList.remove('active'); nav.querySelector('.menu__header').classList.remove('active');
nav.querySelector('.menu__title').innerHTML = ''; nav.querySelector('.menu__title').innerHTML = '';
menu.querySelectorAll('.menu__subs').forEach(submenu => { menu.querySelectorAll('.menu__subs').forEach(submenu => {
submenu.classList.remove('active'); submenu.classList.remove('active');
submenu.style.removeProperty("animation"); submenu.style.removeProperty('animation');
}); });
}, 300);
return [];
} }
document.querySelectorAll('.menu__container').forEach(menu => { document.querySelectorAll('.menu__container').forEach(menu => {
@ -61,11 +65,14 @@ document.querySelectorAll('.menu__container').forEach(menu => {
}); });
menu.querySelector('.menu__close').addEventListener('click', () => { menu.querySelector('.menu__close').addEventListener('click', () => {
menu__toggle(menuNav, menuOverlay); menuChildren = menu__reset(menu, menuNav, menuOverlay);
setTimeout(() => { });
menu__reset(menu, menuNav);
menuChildren = []; menu.querySelectorAll('.menu__link > a[target="_blank"]').forEach(link => {
}, 300); link.addEventListener('click', (e) => {
menuChildren = menu__reset(menu, menuNav, menuOverlay);
e.target.blur();
});
}); });
menu.querySelector('.menu__trigger').addEventListener('click', () => { menu.querySelector('.menu__trigger').addEventListener('click', () => {
@ -77,13 +84,10 @@ document.querySelectorAll('.menu__container').forEach(menu => {
}); });
window.onresize = function () { window.onresize = function () {
if (this.innerWidth >= 992) {
if (menuNav.classList.contains('active')) { if (menuNav.classList.contains('active')) {
menu__toggle(menuNav, menuOverlay); var fontSizeRoot = parseFloat(getComputedStyle(document.documentElement).fontSize);
setTimeout(() => { if (this.innerWidth >= 62 * fontSizeRoot) {
menu__reset(menu, menuNav); menuChildren = menu__reset(menu, menuNav, menuOverlay);
menuChildren = [];
}, 300);
} }
} }
}; };