javascript - mouseEffect 05 : 마우스 이팩트 - 이미지 효과2

 const circle = document.querySelector(".cursor").getBoundingClientRect(); 

    function mouseMove(e){
     
        let mousePageX = e.pageX;
        let mousePageY = e.pageY;

        let centerPageX = window.innerWidth/2 - mousePageX;
        let centerPageY = window.innerHeight/2 - mousePageY;

        let maxPageX = Math.max(-800, Math.min(800, centerPageX));
        let maxPageY = Math.max(-300, Math.min(300, centerPageY));

        let anLeXpageX = maxPageX * 0.12;
        let anLeXpageY = maxPageY * 0.12;

        let softPageX = 0, softPageY = 0;
        softPageX += (anLeXpageX - softPageX) * 0.7;
        softPageY += (anLeXpageY - softPageY) * 0.7;
   
        const imgMove = document.querySelector(".mouse__img");
        imgMove.style.transform = "perspective(1800px) rotateX("+softPageY+"deg) rotateY("+ -softPageX+"deg)";

        
        let circleWidht = mousePageX - circle.width/2;
        let circleHeight = mousePageY - circle.height/2;

        gsap.to(".cursor", {duration: .3, left: circleWidht , top: circleHeight});
      
        document.querySelector(".mousePageX").textContent = mousePageX;
        document.querySelector(".mousePageY").textContent = mousePageY;
        document.querySelector(".centerPageX").textContent = centerPageX;
        document.querySelector(".centerPageY").textContent = centerPageY;
        document.querySelector(".maxPageX").textContent = maxPageX;
        document.querySelector(".maxPageY").textContent = maxPageY;

    }
    document.addEventListener("mousemove", mouseMove)

https://jowuseop1110.github.io/webs_class/javascript/effect/mouseEffect05.html