fipguide.github.io/assets/js/mobileMenu.js at 80478ddc93eda6b03aa8d84c49db00146993a7db · fipguide/fipguide.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
function initMobileMenu() {
  const menuButton = document.querySelector(".o-nav__menu-button");
  const closeButton = document.querySelector(".o-nav__close-button");

  menuButton.addEventListener("click", () => {
    openMobileMenu();
  });

  closeButton.addEventListener("click", () => {
    closeMobileMenu();
  });

  window.onclick = (e) => {
    if (e.target.classList.contains("o-header__curtain")) {
      closeMobileMenu();
    }
  };

  // Close search on ESC
  document.addEventListener("keydown", (e) => {
    if (e.key === "Escape") {
      closeMobileMenu();
    }
  });
}

function openMobileMenu() {
  const navContainer = document.querySelector(".o-header__nav");
  const menuButton = document.querySelector(".o-nav__menu-button");

  navContainer.classList.add("o-header__nav--open");
  menuButton.setAttribute("aria-expanded", true);
}

function closeMobileMenu() {
  const navContainer = document.querySelector(".o-header__nav");
  const menuButton = document.querySelector(".o-nav__menu-button");

  navContainer.classList.remove("o-header__nav--open");
  menuButton.setAttribute("aria-expanded", false);
}

if (document.readyState === "interactive") {
  initMobileMenu();
} else {
  window.addEventListener("DOMContentLoaded", () => {
    initMobileMenu();
  });
}