generated from github/codespaces-blank
-
Notifications
You must be signed in to change notification settings - Fork 0
/
app.js
35 lines (34 loc) · 1.26 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
(function () {
[...document.querySelectorAll(".control")].forEach(button => {
button.addEventListener("click", function() {
document.querySelector(".active-btn").classList.remove("active-btn");
this.classList.add("active-btn");
document.querySelector(".active").classList.remove("active");
document.getElementById(button.dataset.id).classList.add("active");
})
});
document.querySelector(".theme-btn").addEventListener("click", () => {
document.body.classList.toggle("light-mode");
})
})();
const cursor = document.querySelector(".cursor");
window.addEventListener("mousemove", (e) => {
cursor.style.left = e.pageX + "px";
cursor.style.top = e.pageY + "px";
cursor.setAttribute("data-fromTop", cursor.offsetTop - scrollY);
// console.log(e)
});
window.addEventListener("scroll", () => {
const fromTop = cursor.getAttribute("data-fromTop");
cursor.style.top = scrollY + parseInt(fromTop) + "px";
console.log(scrollY);
});
window.addEventListener("click", () => {
if (cursor.classList.contains("click")) {
cursor.classList.remove("click");
void cursor.offsetWidth; // trigger a DOM reflow
cursor.classList.add("click");
} else {
cursor.classList.add("click");
}
});