@media (hover: hover) and (pointer: fine) { html, body, *, *::before, *::after { cursor: none !important; } } #zon-cursor-ring { position: fixed; top: 0; left: 0; width: 36px; height: 36px; border: 1px solid rgba(212,169,60,0.8); border-radius: 50%; pointer-events: none; z-index: 2147483647; opacity: 0; transition: opacity 0.4s, width 0.3s, height 0.3s, background-color 0.3s; will-change: transform; transform: translate(-200px,-200px); } #zon-cursor-dot { position: fixed; top: 0; left: 0; width: 6px; height: 6px; background: #d4a93c; border-radius: 50%; pointer-events: none; z-index: 2147483647; opacity: 0; will-change: transform; transform: translate(-200px,-200px); } #zon-cursor-ring.is-visible { opacity: 1; } #zon-cursor-dot.is-visible { opacity: 1; } #zon-cursor-ring.is-hovering { width: 52px; height: 52px; border-color: rgba(212,169,60,0.4); background-color: rgba(212,169,60,0.07); } #zon-cursor-ring.is-clicking { width: 24px; height: 24px; background-color: rgba(212,169,60,0.2); } (function () { if (!window.matchMedia('(hover:hover) and (pointer:fine)').matches) return; var ring = document.createElement('div'); ring.id = 'zon-cursor-ring'; var dot = document.createElement('div'); dot.id = 'zon-cursor-dot'; document.body.appendChild(ring); document.body.appendChild(dot); var mx = -200, my = -200, rx = -200, ry = -200, LAG = 0.09; document.addEventListener('mousemove', function (e) { mx = e.clientX; my = e.clientY; dot.style.transform = 'translate(' + (mx - 3) + 'px,' + (my - 3) + 'px)'; if (!dot.classList.contains('is-visible')) { ring.classList.add('is-visible'); dot.classList.add('is-visible'); rx = mx; ry = my; } }); document.addEventListener('mouseleave', function () { ring.classList.remove('is-visible'); dot.classList.remove('is-visible'); }); var SEL = 'a, button, .elementor-button, .nav-order, .btn-primary, .btn-secondary'; document.addEventListener('mouseover', function (e) { if (e.target.closest(SEL)) { ring.classList.add('is-hovering'); dot.classList.add('is-hovering'); } }); document.addEventListener('mouseout', function (e) { if (e.target.closest(SEL)) { ring.classList.remove('is-hovering'); dot.classList.remove('is-hovering'); } }); document.addEventListener('mousedown', function () { ring.classList.add('is-clicking'); dot.classList.add('is-clicking'); }); document.addEventListener('mouseup', function () { ring.classList.remove('is-clicking'); dot.classList.remove('is-clicking'); }); (function loop() { rx += (mx - rx) * LAG; ry += (my - ry) * LAG; ring.style.transform = 'translate(' + (rx - 18) + 'px,' + (ry - 18) + 'px)'; requestAnimationFrame(loop); })(); })();
Acquire

Hello world!

Welcome to WordPress. This is your first post. Edit or delete it, then start writing!

One Response

Leave a Reply

Your email address will not be published. Required fields are marked *