-
Notifications
You must be signed in to change notification settings - Fork 0
/
script.js
52 lines (50 loc) · 1.73 KB
/
script.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
let codyLillywhiteh1 = document.getElementById("codyLillywhiteh1");
const titleNav = document.getElementById('titleNav');
let background = document.getElementById("bg");
let smallNavDisplayActive =false;
const NAV_ANCHOR_NAMES = ["About", "Interests", "Projects", "Contact"];
const isDisplayingSmallNav = false;
document.addEventListener("scroll", () => {
if(window.scrollY > 400) {
titleNav.classList.remove('isHidden');
}
else if(window.scrollY < 350){
titleNav.classList.add('isHidden');
}
if(smallNavDisplayActive) {
setSmallNavDisplayInactive();
}
});
document.getElementById('navIcon').addEventListener('click', () => {
if(smallNavDisplayActive) {
setSmallNavDisplayInactive();
}
else {
setSmallNavDisplayActive();
smallNavDisplayActive = true;
}
})
function setSmallNavDisplayActive() {
document.getElementById('nav').style.height = "40vh";
for(anchor of NAV_ANCHOR_NAMES) {
displayNavAnchorByName(anchor);
}
document.getElementById("About").style.paddingTop = "30px";
}
function setSmallNavDisplayInactive() {
document.getElementById('nav').style.height = "6vh";
smallNavDisplayActive = false;
for(anchor of NAV_ANCHOR_NAMES) {
document.getElementById(anchor).remove();
}
}
function displayNavAnchorByName(anchorName) {
let elem = document.createElement("a");
elem.classList.add("anchor", "navText");
elem.setAttribute("id",anchorName);
elem.style.display = "block";
elem.innerText = anchorName;
elem.addEventListener("click", () => setSmallNavDisplayInactive());
elem.href = "#"+anchorName.toLowerCase();
document.getElementById('smallScreenNav').appendChild(elem);
}