我做lerp所有的时间,但最近一直有这个问题,其中lerp的功能(在下面的animIt
函数中)返回NaN
。控制台日志显示lerp()
的返回值是一个数字。我尝试了很多方法,包括parseFloat
和toFixed(0)
,但都没有用。有人能帮我弄清楚是什么问题吗?我无法继续我的项目。谢谢。
function lerp(start, end, t){
return (1-t)*start+t*end
}
let currentX = 0, currentY = 0;
let cursorContainer = document.querySelector('#irbrkj');
let observer1 = new IntersectionObserver( function(el, observer) {
el.forEach( (entry) => {
if(entry.isIntersecting){
document.addEventListener( 'mousemove', (e) => {
offX = e.offsetX;
offY = e.offsetY;
})
function animIt(){
currentX = lerp(currentX, offX, 0.3 );
currentY = lerp(currentY, offY, 0.3 );
// These are showing NaN
console.log(currentX);
console.log(currentY);
cursorContainer.style.setProperty('--cursorTop', currentY + 'px');
cursorContainer.style.setProperty('--cursorLeft', currentX + 'px');
requestAnimationFrame(animIt);
}
animIt();
}
})
}, {
threshold: 0.2
});
observer1.observe(cursorContainer);
1条答案
按热度按时间eoxn13cs1#
好的,明白了!当我定义
offX
和offY
的时候,它们没有值,所以我把它们定义为let offX = 0, offY = 0
,现在lerp()
有一个0开始工作。希望这对其他人有帮助。