-
Notifications
You must be signed in to change notification settings - Fork 0
/
main.js
60 lines (51 loc) · 1.83 KB
/
main.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
const hamburgerBtn = document.getElementById("hamburgerBtn");
const hamburgerLists = document.getElementById("hamburgerLists");
hamburgerBtn.addEventListener("click", () => {
hamburgerLists.classList.toggle("absolute");
hamburgerLists.classList.toggle("hidden");
hamburgerLists.classList.toggle("my-2");
hamburgerBtn.classList.toggle("hamburger-active");
});
// window.addEventListener("click", function (e) {
// if (e.target != hamburgerBtn && e.target != hamburgerLists) {
// hamburgerLists.classList.remove("absolute");
// hamburgerLists.classList.remove("hidden");
// hamburgerLists.classList.remove("my-2");
// hamburgerBtn.classList.remove("hamburger-active");
// hamburgerLists.classList.add("hidden");
// }
// });
// window.onload = function () {
// document.body.classList.add("loaded");
// };
window.onscroll = function () {
const header = document.querySelector("nav");
const fixedNav = header.offsetTop;
const toTop = document.querySelector("#to-top");
if (window.pageYOffset > fixedNav) {
toTop.classList.remove("hidden");
toTop.classList.add("flex");
} else {
toTop.classList.remove("flex");
toTop.classList.add("hidden");
}
};
const sections = document.querySelectorAll("section[id]");
function scrollActive() {
const scrollY = window.pageYOffset;
sections.forEach((current) => {
const sectionHeight = current.offsetHeight,
sectionTop = current.offsetTop - 58,
sectionId = current.getAttribute("id");
if (scrollY > sectionTop && scrollY <= sectionTop + sectionHeight) {
document
.querySelector(`nav a[href*=${sectionId}]`)
.classList.add("active-link");
} else {
document
.querySelector(`nav a[href*=${sectionId}]`)
.classList.remove("active-link");
}
});
}
window.addEventListener("scroll", scrollActive);