Question

I’m trying to get the current position (between 0 and 360°) of .me during this animation :

http://jsfiddle.net/WcyyF/117/

So the hover out event doesn’t start the animation from 0 but continues it from x.

Answer 1

Another option with slightly less complex math is to track when the animation starts, and when it is interrupted. Since it runs at a constant speed you can use the elapsed time to work out how many degrees each element should have traveled, and update the starting positions accordingly. Roughly along the lines of:

var elapsedTime = new Date().getTime() - this.startedAt;
var elapsedDegrees = Math.floor(360 * (elapsedTime / 20000));
$(".me").each(function() {
    $(this).attr('data', parseInt($(this).attr('data')) - elapsedDegrees + 360)
});

Here is an example: http://jsfiddle.net/WcyyF/120/