adventskalender/shared/js/glitter.js aktualisiert
This commit is contained in:
@@ -1,10 +1,12 @@
|
|||||||
// Bratonien Glitter Hover Effekt – für .door, .openfield und .fluegel
|
// Bratonien Glitter Hover Effekt – für .door, .openfield und .fluegel
|
||||||
|
|
||||||
document.querySelectorAll(".door, .openfield, .fluegel").forEach(elem => {
|
document.querySelectorAll(".door, .openfield, .fluegel").forEach(elem => {
|
||||||
let canvas, ctx, particles = [], anim, hovering = false;
|
let canvas, ctx, particles = [], anim, hovering = false;
|
||||||
let cursorX = 0, cursorY = 0;
|
let cursorX = 0, cursorY = 0;
|
||||||
|
|
||||||
const day = elem.dataset.day;
|
const day = elem.dataset.day;
|
||||||
let partner = null;
|
let partner = null;
|
||||||
|
let openfield = null;
|
||||||
|
|
||||||
if (elem.classList.contains("door")) {
|
if (elem.classList.contains("door")) {
|
||||||
partner = document.querySelector(`.openfield[data-day="${day}"]`);
|
partner = document.querySelector(`.openfield[data-day="${day}"]`);
|
||||||
@@ -18,6 +20,7 @@ document.querySelectorAll(".door, .openfield, .fluegel").forEach(elem => {
|
|||||||
} else if (isRight) {
|
} else if (isRight) {
|
||||||
partner = document.querySelector(`.fluegel.left[data-day="${day}"]`);
|
partner = document.querySelector(`.fluegel.left[data-day="${day}"]`);
|
||||||
}
|
}
|
||||||
|
openfield = document.querySelector(`.openfield[data-day="${day}"]`);
|
||||||
}
|
}
|
||||||
|
|
||||||
function setupCanvas() {
|
function setupCanvas() {
|
||||||
@@ -92,9 +95,8 @@ document.querySelectorAll(".door, .openfield, .fluegel").forEach(elem => {
|
|||||||
cancelAnimationFrame(anim);
|
cancelAnimationFrame(anim);
|
||||||
draw();
|
draw();
|
||||||
|
|
||||||
if (partner) {
|
if (partner) partner.classList.add("hover-proxy");
|
||||||
partner.classList.add("hover-proxy");
|
if (openfield) openfield.classList.add("hover-proxy");
|
||||||
}
|
|
||||||
});
|
});
|
||||||
|
|
||||||
// HOVER ENDE
|
// HOVER ENDE
|
||||||
@@ -108,8 +110,7 @@ document.querySelectorAll(".door, .openfield, .fluegel").forEach(elem => {
|
|||||||
}
|
}
|
||||||
}, 300);
|
}, 300);
|
||||||
|
|
||||||
if (partner) {
|
if (partner) partner.classList.remove("hover-proxy");
|
||||||
partner.classList.remove("hover-proxy");
|
if (openfield) openfield.classList.remove("hover-proxy");
|
||||||
}
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
Reference in New Issue
Block a user