移动到新部分时更改鼠标圆圈的颜色

Question

我有一个小而简单的 js 脚本（刚刚开始），可以让我网站上的鼠标变成一个圆圈，而不是一个常规的。我需要让它在下一个网站部分切换边框颜色。这是要在 js 中更改还是应该在 HTML、CSS 中更改？

这是测试网络的链接 - https://naughty-cori-05cc08.netlify.app/

let navLinks = document.querySelectorAll('.nav-links li');

window.addEventListener('mousemove',cursor);

function cursor(e) {

    mouseCursor.style.top = e.pageY + 'px';

    mouseCursor.style.left = e.pageX + 'px';

    div.style.border = white;

    

}

navLinks.forEach(link => {

    link.addEventListener("mouseleave", () => {

        mouseCursor.classList.remove("link-grow");

        link.classList.remove("hovered");

        });

link.addEventListener("mouseover", () => {

mouseCursor.classList.add("link-grow");

link.classList.add("hovered");

});

});```

Answer 1

你可以在 css 中非常简单地做到这一点：cursor: url(your_image_path.png) (width) (height), (mode);现在...如果你没有考虑制作一个真正的.png-.jpeg-.ani，我不知道是否有办法做到这一点，谷歌更多。