https://hotelcumberland.co.uk/wp-content/themes/hotel-cumberland-theme/js/global/navbar.js?ver=7.1.3

1const navbar = () => {
2
3    const nav = document.querySelector('nav')
4
5    if(!nav) return
6
7    const menu_button = nav.querySelector('.menu_button')
8
9    menu_button.addEventListener('click', () => {
10        nav.classList.toggle('is_active')
11        html.classList.toggle('is_active')
12    })
13
14    const side_menu_background = nav.querySelector('.side_menu_background')
15    const html = document.querySelector('html')
16
17    side_menu_background.addEventListener('click', () => {
18        nav.classList.toggle('is_active')
19        html.classList.toggle('is_active')
20    })
21   
22    const side_menu = nav.querySelector('.side_menu')
23
24    side_menu.addEventListener('click', (e) => {
25        if(e.target.closest('a')) {
26            nav.classList.toggle('is_active')
27            html.classList.toggle('is_active')
28        }
29    })
30
31  /*------------------------------------*\
32      SCROLL AND CHANGE NAV STATE
33  \*------------------------------------*/
34  // Previous scroll position
35  let prevScrollPos = window.scrollY;
36  let ticking = false;
37  
38  const handleScroll = () => {
39    // Current scroll position
40    let currentScrollPos = window.scrollY;
41  
42      if (prevScrollPos > 80) {
43        // Scrolling up
44        nav.classList.add("change_nav");
45      } else {
46        // Scrolling down
47        nav.classList.remove("change_nav");
48      }
49  
50      // Update the previous scroll position to the current scroll position
51      prevScrollPos = currentScrollPos;
52   
53    ticking = false;
54  };
55  
56  // Whilst ticking is true the function won't be called again. Ensuring that the function is called at most once per frame
57  const onScroll = () => {
58    if (!ticking) {
59      // Smooth animations and frequent UI updates because it synchronizes the function execution with the browser's repaint cycle
60      window.requestAnimationFrame(handleScroll);
61      ticking = true;
62    }
63  };
64  
65  window.addEventListener("scroll", onScroll);
66
67}
68
69window.addEventListener('DOMContentLoaded', navbar)