come animare seguendo il mouse in jquery

Question

OK, funziona perfettamente per seguire il mio mouse.

// 
$(document).mousemove(function(e){ 
    $("#follower").css({ 
     'top': e.pageY + 'px'; 
     'left': e.pageX + 'px'; 
    }); 
}); 
// 

E questo funziona alla grande per animare il mouse a un punto

// 
$(document).click(function(e){ 
    $("#follower").animate({ 
     top: e.pageY + 'px'; 
     left: e.pageX + 'px'; 
    }, 800); 
}); 
// 

Ma Personalmente ritengo che logicamente questo dovrebbe funzionare cliccato! Dal mio punto di vista come il webscripter. E poi la mia domanda è, come posso fare questo lavoro. Voglio che il #follower provi a seguire il mio mouse con un tipo dinamico di ritardo nel sentire.

// 
$(document).mousemove(function(e){ 
    $("#follower").animate({ 
     top: e.pageY + 'px'; 
     left: e.pageX + 'px'; 
    }, 800); 
}); 
// 

Answer 1

ne dite di usare setInterval e paradosso un'equazione chiamato di Zeno:

http://jsfiddle.net/88526/1/

Questo è il modo in cui io di solito faccio.

Come richiesto, ho incluso il codice in questa risposta. Dato un div con posizionamento assoluto:

CSS:

#follower{ 
    position : absolute; 
    background-color : red; 
    color : white; 
    padding : 10px; 
} 

HTML:

<div id="follower">Move your mouse</div> 

JS w/jQuery:

var mouseX = 0, mouseY = 0; 
$(document).mousemove(function(e){ 
    mouseX = e.pageX; 
    mouseY = e.pageY; 
}); 

// cache the selector 
var follower = $("#follower"); 
var xp = 0, yp = 0; 
var loop = setInterval(function(){ 
    // change 12 to alter damping, higher is slower 
    xp += (mouseX - xp)/12; 
    yp += (mouseY - yp)/12; 
    follower.css({left:xp, top:yp}); 

}, 30);