kevinveenbirkenbach/homepage.veen.world
1
0
Fork 0
mirror of https://github.com/kevinveenbirkenbach/homepage.veen.world.git synced 2025-11-04 01:18:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

Optimized menu bug

Browse Source
This commit is contained in:
Kevin Veen-Birkenbach
2025-01-14 17:52:31 +01:00
parent f017cacebe
commit 00e0096f8a
1 changed files with 13 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
app/static/js/navigation.js
View File

@@ -16,8 +16,9 @@ document.addEventListener('DOMContentLoaded', () => {
timeout = setTimeout(() => closeMenu(item), 500); timeout = setTimeout(() => closeMenu(item), 500);
}); });
// Offen lassen beim Klicken // Öffnen und Position anpassen beim Klicken
item.addEventListener('click', (e) => { item.addEventListener('click', (e) => {
e.preventDefault(); // Verhindert die Standardaktion
e.stopPropagation(); // Verhindert das Schließen von Menüs bei Klick e.stopPropagation(); // Verhindert das Schließen von Menüs bei Klick
if (item.classList.contains('open')) { if (item.classList.contains('open')) {
closeMenu(item); closeMenu(item);
@@ -41,8 +42,9 @@ document.addEventListener('DOMContentLoaded', () => {
timeout = setTimeout(() => closeMenu(item), 500); timeout = setTimeout(() => closeMenu(item), 500);
}); });
// Offen lassen beim Klicken // Öffnen und Position anpassen beim Klicken
item.addEventListener('click', (e) => { item.addEventListener('click', (e) => {
e.preventDefault(); // Verhindert die Standardaktion
e.stopPropagation(); // Verhindert das Schließen von Menüs bei Klick e.stopPropagation(); // Verhindert das Schließen von Menüs bei Klick
if (item.classList.contains('open')) { if (item.classList.contains('open')) {
closeMenu(item); closeMenu(item);
@@ -97,29 +99,21 @@ document.addEventListener('DOMContentLoaded', () => {
if (isTopLevel) { if (isTopLevel) {
// Top-Level-Menüs öffnen nur nach oben oder unten // Top-Level-Menüs öffnen nur nach oben oder unten
if (spaceBelow < rect.height && spaceAbove > rect.height) { if (spaceBelow < rect.height && spaceAbove > rect.height) {
submenu.style.top = 'auto';
submenu.style.bottom = '100%'; submenu.style.bottom = '100%';
submenu.style.top = 'auto';
} else { } else {
submenu.style.top = '100%'; submenu.style.top = `${parentRect.height}px`;
submenu.style.bottom = 'auto'; submenu.style.bottom = 'auto';
} }
} else { } else {
// Submenüs öffnen in die Richtung mit mehr Platz // Submenüs öffnen in die Richtung mit mehr Platz
if (spaceRight < rect.width && spaceLeft > rect.width) { const prefersRight = spaceRight >= spaceLeft;
submenu.style.left = 'auto'; submenu.style.left = prefersRight ? '100%' : 'auto';
submenu.style.right = '100%'; submenu.style.right = prefersRight ? 'auto' : '100%';
} else {
submenu.style.left = '100%';
submenu.style.right = 'auto';
}
if (spaceBelow < rect.height && spaceAbove > rect.height) { const prefersBelow = spaceBelow >= spaceAbove;
submenu.style.top = 'auto'; submenu.style.top = prefersBelow ? '0' : 'auto';
submenu.style.bottom = '100%'; submenu.style.bottom = prefersBelow ? 'auto' : '100%';
} else {
submenu.style.top = '0';
submenu.style.bottom = 'auto';
}
} }
} }
}); });