滚动页面后自定义光标的位置错误

Question

我正在尝试使用带有外环的精美圆形光标之一，例如，当您将鼠标悬停在图像上时，这种变化会改变。

我发现大多数代码已经建立在codepen上，但是当我将其应用于更长的页面时，光标似乎偏离了太多可见像素。在开始滚动之前，它工作正常，随着滚动的增加，偏移量也会增加，如果滚动，它几乎无用，看不到光标。

这是经过修改的codepen：https://codepen.io/miguelpppires/pen/xxKLreP

我几乎100％确信这是问题所在，但我不知道如何解决：

$(document).on('mousemove', function(e) {

$('.cursor, .follower').css({
"transform": "translate3d(" + (e.pageX) + "px, " + (e.pageY) + "px, 0px)"
});

感谢您的帮助， 谢谢

Answer 1

您需要使用clientX和clientY，因为pageX和pageY取自页面顶部的偏移量，clientX和{{1 }}取自视口顶部的偏移量。

clientY

Answer 2

我使用clientX和clientY的pageX和pageY解决了问题。