22 * Mobile Navigation Menu
33 * Handles touch/click events for mobile devices where hover doesn't work properly
44 */
5- ( function ( ) {
6- 'use strict' ;
7-
8- function initMobileMenu ( ) {
9- // Find the mobile dropdown toggle
10- const mobileDropdown = document . querySelector ( '.resp-nav-dropdown' ) ;
11- const dropdownContent = document . querySelector ( '.resp-dropdown-content' ) ;
12-
13- if ( ! mobileDropdown || ! dropdownContent ) {
14- return ;
15- }
16-
17- // Add click event listener to toggle mobile menu
18- mobileDropdown . addEventListener ( 'click' , function ( e ) {
19- e . preventDefault ( ) ;
20- e . stopPropagation ( ) ;
21-
22- // Toggle the show class
23- dropdownContent . classList . toggle ( 'show' ) ;
24- } ) ;
25-
26- // Close menu when clicking outside
27- document . addEventListener ( 'click' , function ( e ) {
28- if ( ! mobileDropdown . contains ( e . target ) ) {
29- dropdownContent . classList . remove ( 'show' ) ;
30- }
31- } ) ;
32-
33- // Close menu when pressing escape key
34- document . addEventListener ( 'keydown' , function ( e ) {
35- if ( e . key === 'Escape' ) {
36- dropdownContent . classList . remove ( 'show' ) ;
37- }
38- } ) ;
39-
40- // Close menu when window is resized to desktop size
41- window . addEventListener ( 'resize' , function ( ) {
42- if ( window . innerWidth > 650 ) {
43- dropdownContent . classList . remove ( 'show' ) ;
44- }
45- } ) ;
46- }
47-
48- // Initialize when DOM is ready
49- if ( document . readyState === 'loading' ) {
50- document . addEventListener ( 'DOMContentLoaded' , initMobileMenu ) ;
51- } else {
52- initMobileMenu ( ) ;
5+ ( function ( ) {
6+ 'use strict' ;
7+
8+ function initMobileMenu ( ) {
9+ // Find the mobile dropdown toggle
10+ const mobileDropdown = document . querySelector ( '.resp-nav-dropdown' ) ;
11+ const dropdownContent = document . querySelector ( '.resp-dropdown-content' ) ;
12+
13+ if ( ! mobileDropdown || ! dropdownContent ) {
14+ return ;
5315 }
16+
17+ // Add click event listener to toggle mobile menu
18+ mobileDropdown . addEventListener ( 'click' , ( e ) => {
19+ e . preventDefault ( ) ;
20+ e . stopPropagation ( ) ;
21+
22+ // Toggle the show class
23+ dropdownContent . classList . toggle ( 'show' ) ;
24+ } ) ;
25+
26+ // Close menu when clicking outside
27+ document . addEventListener ( 'click' , ( e ) => {
28+ if ( ! mobileDropdown . contains ( e . target ) ) {
29+ dropdownContent . classList . remove ( 'show' ) ;
30+ }
31+ } ) ;
32+
33+ // Close menu when pressing escape key
34+ document . addEventListener ( 'keydown' , ( e ) => {
35+ if ( e . key === 'Escape' ) {
36+ dropdownContent . classList . remove ( 'show' ) ;
37+ }
38+ } ) ;
39+
40+ // Close menu when window is resized to desktop size
41+ window . addEventListener ( 'resize' , ( ) => {
42+ if ( window . innerWidth > 650 ) {
43+ dropdownContent . classList . remove ( 'show' ) ;
44+ }
45+ } ) ;
46+ }
47+
48+ // Initialize when DOM is ready
49+ if ( document . readyState === 'loading' ) {
50+ document . addEventListener ( 'DOMContentLoaded' , initMobileMenu ) ;
51+ } else {
52+ initMobileMenu ( ) ;
53+ }
5454} ) ( ) ;
0 commit comments