-
Notifications
You must be signed in to change notification settings - Fork 0
/
app.js
95 lines (42 loc) · 1.5 KB
/
app.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
90
91
92
93
94
const navSlide = () => {
const burger = document.querySelector('.burger');
const nav = document.querySelector('.nav-links');
const navlinks = document.querySelectorAll('.nav-links li')
burger.addEventListener('click', () => {
//toggle nav
nav.classList.toggle('nav-active');
//animate links
navlinks.forEach((link, index) => {
if (link.style.animation) {
link.style.animation = '';
}
else {
link.style.animation = `navlinkfade 0.4s ease forwards ${index / 7 + 0.4}s`
}
})
//animate burger
burger.classList.toggle('burgeranimation');
})
}
navSlide();
// const navSlide = () => {
// const burger = document.querySelector('.burger');
// const nav = document.querySelector('.nav-links');
// const navlinks = document.querySelectorAll('.nav-links li');
// burger.addEventListener('click', () => {
// // Toggle nav
// nav.classList.toggle('nav-active')
// // Animate nav
// navlinks.forEach((link, index) => {
// if (link.style.animation) {
// link.style.animation = '';
// }
// else {
// link.style.animation = `navlinkfade 0.5s ease forwards ${index / 7 + 0.4}s`;
// }
// });
// // Burger Animation
// burger.classList.toggle('burgeranimation');
// });
// }
// navSlide();