Question

我有几个div慢慢跟随鼠标位置。在开始时，它开始很好，但它越接近鼠标位置越慢。我有一个非常有效的代码，但我想改进它，以便div始终以恒定的速度跟随鼠标，而不是改变它。

var xp = x, yp = y;
var loop = setInterval(function(){
xp += ((mouseX - xp) ) / 100;
yp += ((mouseY - yp)) / 100;
object.css({left:xp, top:yp});
},20);}

因为当它越来越接近它时，数学变得越来越小，导致X / Y移动得越来越慢。我希望它保持相同的速度，无论它来自何处。

Answer 1

以下是解决方案：

var loop = setInterval(
    function()
    {
        speed = 20;
        xp += (mouseX - xp)>speed ? speed : ((mouseX - xp)<-speed ? -speed : (mouseX - xp));
        yp += (mouseY - yp)>speed ? speed : ((mouseY - yp)<-speed ? -speed : (mouseY - yp));
        object.css({left:xp, top:yp});
    },20
);

Answer 2

您是否尝试过使用网络工作者？

使用Web worker，您可以在后台线程中发送“繁重”的任务，这样您的UI线程就不会变得迟钝，Web应用程序也会保持响应。

设置起来非常简单。

var worker = new Worker('someWorker.js');

看看：

https://developer.mozilla.org/En/Using_web_workers

鼠标位置后的对象减慢

2 个答案: