
마우스 효과 3번째 조명 효과입니다! 다른 효과들 보다 뭔가 집중이 잘 되는 효과인거같아요 진짜 조명으로 비추고 있는 느낌이 들죠?? //요소값 알기 // const circle1 = document.querySelector(".cursor").clientWidth; //190 : border 빠진 상태 // const circle2 = document.querySelector(".cursor").offsetWidth; //200 : border 포함 상태 const circle = document.querySelector(".cursor").getBoundingClientRect(); //bottom height left right top width x y function follow(e){ gsap...

안녕하세요 오늘은 마우스 따라가기 효과 2번째를 배웠습니다. 요리조리 잘 따라오는 커서가 너무 귀엽네요 ㅎㅎ 다들 포토플리오 만들때 참고하시면 좋을 것 같습니다. ^-^ const cursor = document.querySelector(".cursor"); const follower = document.querySelector(".cursor-follower"); window.addEventListener("mousemove", e => { //커서 좌표값 할당 // cursor.style.left = e.pageX + "px"; // cursor.style.top = e.pageY + "px"; // follower.style.left = e.pageX -10 + "px"; // follower.st..