-
Notifications
You must be signed in to change notification settings - Fork 0
/
scriptsNav.js
89 lines (78 loc) · 2.97 KB
/
scriptsNav.js
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
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
// Select elements
const burger = document.querySelector('.burger');
const nav = document.querySelector('.nav-links');
const dropdowns = document.querySelectorAll('.nav-item.dropdown');
const navLinks = document.querySelectorAll('.navbar-nav .nav-item');
// Check if elements exist before adding event listeners
if (burger && nav) {
// Toggle navigation menu
burger.addEventListener('click', () => {
nav.classList.toggle('nav-active');
burger.classList.toggle('toggle');
const expanded = burger.getAttribute('aria-expanded') === 'true' || false;
burger.setAttribute('aria-expanded', !expanded);
});
}
// Dropdown menu animation and functionality
dropdowns.forEach(dropdown => {
const dropdownToggle = dropdown.querySelector('.dropdown-toggle');
const dropdownMenu = dropdown.querySelector('.dropdown-menu');
dropdownToggle.addEventListener('click', (e) => {
e.preventDefault();
const isActive = dropdownMenu.classList.contains('show');
// Hide all other dropdowns
dropdowns.forEach(item => {
const menu = item.querySelector('.dropdown-menu');
if (menu !== dropdownMenu && menu.classList.contains('show')) {
menu.classList.remove('show');
}
});
// Toggle current dropdown
dropdownMenu.classList.toggle('show');
});
// Close dropdown when clicking dropdown links
const dropdownLinks = dropdown.querySelectorAll('.dropdown-item');
dropdownLinks.forEach(link => {
link.addEventListener('click', () => {
dropdownMenu.classList.remove('show');
});
});
});
// Close dropdowns on hover outside
navLinks.forEach(link => {
link.addEventListener('mouseenter', () => {
dropdowns.forEach(dropdown => {
const dropdownMenu = dropdown.querySelector('.dropdown-menu');
dropdownMenu.classList.remove('show');
});
});
});
// Close dropdowns when clicking outside
document.addEventListener('click', (e) => {
dropdowns.forEach(dropdown => {
const dropdownMenu = dropdown.querySelector('.dropdown-menu');
if (!dropdown.contains(e.target)) {
dropdownMenu.classList.remove('show');
}
});
});
// Close dropdowns on ESC key press
document.addEventListener('keydown', (e) => {
if (e.key === 'Escape') {
dropdowns.forEach(dropdown => {
const dropdownMenu = dropdown.querySelector('.dropdown-menu');
dropdownMenu.classList.remove('show');
});
}
});
// Submit search form
const searchInput = document.getElementById('search-input');
if (searchInput) {
searchInput.addEventListener('keydown', (event) => {
if (event.key === 'Enter') {
event.preventDefault();
console.log('Performing search for: ', searchInput.value);
// Add your search functionality here
}
});
}