Question

我的对象使用onmousemove事件跟踪鼠标。但我想说顺利。我相信这在jQuery中并不难，但我找不到任何非常好的资源。

我的一个想法是简单地使用animate函数并计算我想要移动的偏移量。然后，如果鼠标在动画完成之前再次移动，我将使用stop函数来停止动画。我会重新计算我的目的地然后再去。这似乎有点黑客，我也想象它会有点生涩。我相信必须有更好的方法。任何想法？

修改
对不起，我没有把问题弄清楚。我让对象实时跟踪鼠标，使其与我的鼠标完全相同。问题在于我希望它能够顺畅而且落后于加速效果，如下面提到的Andy Lin。我只是有点迷失如何实际实现这一点。

Answer 1

当您使用onmousemove时，您不需要让对象在每次调用时都改变其行为。

e.g。您可以添加一个计时器，表示在一段时间内，该对象不会响应mousemove并将跟随其原始路径，并在超时或鼠标移动停止时，根据目标移动。

另外，您可以使用动画设置模拟加速和减速效果。

Answer 2

我担心，没有比动画更好的方法了。如果你添加一个平滑函数，那么你只需要做与animate相同的事情。请确保不要将动画排队，否则它们会显得很奇怪。我得到了很好的结果：

var obj = $('<div style="width:50px;height:50px;background:red;position:absolute"></div>');

obj.appendTo(document.body);

$(document).bind('mousemove',function(ev){
 obj.animate({top:ev.pageY,left:ev.pageX},{queue:false,duration:200,easing:'linear'})});

jQuery平滑鼠标跟踪

2 个答案: