notacursor/notacursor.js

A library for giving cursor cool looks in web pages.

/*
    Author: Maruf OVi
    notAcursor project is under the MIT License
*/
const cursorDot=document.querySelector("[data-notacursor-dot]"),cursorOutline=document.querySelector("[data-notacursor-outline]");let mouseX=0,mouseY=0,posX=0,posY=0;function animateOutline(){posX+=(mouseX-posX)/5,posY+=(mouseY-posY)/5,cursorDot.style.top=`${mouseY}px`,cursorDot.style.left=`${mouseX}px`,cursorOutline.style.top=`${posY}px`,cursorOutline.style.left=`${posX}px`,requestAnimationFrame(animateOutline)}function isMobile(){return/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)}window.addEventListener("mousemove",function(e){mouseX=e.clientX,mouseY=e.clientY}),window.addEventListener("mousedown",function(){cursorOutline.style.width="17px",cursorOutline.style.height="17px"}),window.addEventListener("mouseup",function(){cursorOutline.style.width="30px",cursorOutline.style.height="30px"}),isMobile()?(cursorDot.style.display="none",cursorOutline.style.display="none"):animateOutline();