鼠標位置跟隨對象減慢

我有幾個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);}

自從潛水時，它接近100，數學越來越小導致X/Y移動得更慢。無論它來自哪裏，我都希望它保持相同的速度。

來源

2012-05-08 Zakukashi

你想讓它看起來像的div連接到鼠標，或者是你更多對尾巴般的行爲感興趣？像這樣的答案：http://stackoverflow.com/a/3385953/74757 –

@Cory是的我對尾部延遲的行爲感興趣。例如，您移動鼠標並按下div，大約需要2秒左右才能到達鼠標位置。上面的代碼顯示了它的速度，但它越來越慢，我只希望它能夠保持速度。 – Zakukashi

這裏是解決方案：

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 
);

來源

2012-05-08 21:53:11 mostar

這幾乎工作，但它不像原始代碼那樣流暢。在原始divs會順利地跟隨，而在這個div div的Y位置被移動，當它大於mouseY – Zakukashi

當然，'（mouseX-xp）'可能是負數。我編輯瞭解決方案。 – mostar

優秀！謝謝 – Zakukashi

您是否嘗試過使用Web工作人員？

使用web worker，您可以發送'繁重'任務在後臺線程中完成，以便您的UI線程不會變得緩慢，並且您的Web應用程序保持響應。

設置起來非常簡單。

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

看一看：

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

來源

2012-05-08 21:46:12 Ozzy

這些可在所有瀏覽器中使用嗎？非常有趣，如果他們是 – Bryan

@BryanMoyles Chrome 3 +，Firefox 3.5+，IE 10+，Opera 10.6+，Safari 4+ - 它在該鏈接的底部 – Ozzy

Chrome，FireFox和Safari提示用戶更新，99％他們的用戶在更高版本上，所以這些都很好。（三者合計約佔瀏覽器市場的85％）。我對Opera的瞭解不多，IE尚不支持，因爲大多數IE用戶都使用IE8和IE9。 – Ozzy

鼠標位置跟隨對象減慢

回答

相關問題