[英]Custom cursor wrong position after scrolling the page
我正在尝试使用以下外环获得那些花哨的圆形光标之一,例如,当您悬停图像时会发生变化。
我发现大部分代码已经建立在 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)"
});
任何和所有的帮助表示赞赏,谢谢
您需要使用clientX
和clientY
,因为pageX
和pageY
从页面顶部获取偏移量,并且clientX
和clientY
从视口顶部获取偏移量。
$('.cursor, .follower').css({
"transform": "translate3d(" + (e.clientX) + "px, " + (e.clientY) + "px, 0px)"
});
我已经解决了使用 pageX 和 pageY 插入 clientX 和 clientY 的问题。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.