Rick Quiambao – Web Designer

Skip to content

Web Designer

RICK JAYSON
QUIAMBAO

NO-CODE
WEB DESIGNER

(function () { const hero = document.getElementById("hero-jesper"); const cursor = document.getElementById("cursor-mask"); const revealLayer = document.querySelector(".reveal-layer"); if (!hero || !cursor || !revealLayer) return; const radius = 110; let active = false; hero.addEventListener("mouseenter", () => { active = true; cursor.style.opacity = "1"; }); hero.addEventListener("mouseleave", () => { active = false; cursor.style.opacity = "0"; revealLayer.style.webkitMaskImage = "radial-gradient(circle 0px at 0 0, black 0%, transparent 0%)"; revealLayer.style.maskImage = "radial-gradient(circle 0px at 0 0, black 0%, transparent 0%)"; }); document.addEventListener("mousemove", (e) => { if (!active) return; const x = e.clientX; const y = e.clientY; cursor.style.left = `${x}px`; cursor.style.top = `${y}px`; const rect = revealLayer.getBoundingClientRect(); const maskX = x - rect.left; const maskY = y - rect.top; const mask = `radial-gradient(circle ${radius}px at ${maskX}px ${maskY}px, black 100%, transparent 101%)`; revealLayer.style.webkitMaskImage = mask; revealLayer.style.maskImage = mask; }); })();