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