let cursorItem = document.querySelector(".cursorItem");
let circle = document.querySelector(".circle");
let yes = document.querySelector(".yes");
let no = document.querySelector(".no");
let x = 0,
y = 0;
let mx = 0,
my = 0;
window.onload = function () {
// 네 부분 마우스
yes.addEventListener("mouseover", function (e) {
circle.style.transform = "scale(0.3)";
});
yes.addEventListener("mouseout", function (e) {
circle.style.transform = "scale(1)";
});
// 아니오 부분 마우스
no.addEventListener("mouseover", function (e) {
circle.style.transform = "scale(0.3)";
});
no.addEventListener("mouseout", function (e) {
circle.style.transform = "scale(1)";
});
window.addEventListener("mousemove", function (e) {
x = e.clientX;
y = e.clientY;
// cursorItem.style.transform = "translate(" + x + "px, " + y + "px )";
});
loop();
};
function loop() {
mx += (x - mx) * 0.09;
my += (y - my) * 0.09;
cursorItem.style.transform = `translate(${mx}px, ${my}px)`;
requestAnimationFrame(loop);
}