menu.js 1.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940
  1. document.addEventListener('DOMContentLoaded', function () {
  2. // menu overlay so we can open and close it bruh
  3. const overlay = document.querySelector('.menu-overlay');
  4. const hamburger = document.querySelector('.hamburger-menu');
  5. function toggleMenu() {
  6. if (overlay.classList.contains('open')) {
  7. overlay.classList.remove('open');
  8. setTimeout(() => {
  9. overlay.style.visibility = 'hidden';
  10. }, 400); // match this delay with the css transition duration because ja isch halt so
  11. } else {
  12. overlay.style.visibility = 'visible';
  13. overlay.classList.add('open');
  14. }
  15. hamburger.classList.toggle('open');
  16. document.body.style.overflow = overlay.classList.contains('open') ? 'hidden' : ''; // no scrolling on the main page while menu is open
  17. }
  18. // if burger king menu button exists, hook it up to toggle the menu
  19. if (hamburger) {
  20. hamburger.addEventListener('click', function () {
  21. toggleMenu();
  22. });
  23. }
  24. // close menu when clicking a link inside it because so funktioniert das halt, pech gha wenns der nid passt lol
  25. if (overlay) {
  26. overlay.querySelectorAll('a').forEach(link => {
  27. link.addEventListener('click', () => {
  28. overlay.classList.remove('open');
  29. setTimeout(() => {
  30. overlay.style.visibility = 'hidden';
  31. hamburger.classList.remove('open');
  32. document.body.style.overflow = ''; // kei ahnig was das macht aber es het mis problem emol glöst
  33. }, 400); // match transition duration ... again no clue what this actually does but it works so i'm not touching it
  34. });
  35. });
  36. }
  37. });