jQuery和围绕中心点的动画

Question

我想知道围绕中心点以圆形运动对元素进行动画制作的最佳方法吗？

我不能完全弄清楚... :(

在此先感谢。

Neuroflux。

Answer 1

最简单我能想到的是：

1. 使相对
2. 使动画元素是上面
3. 计算顶子，使用留下的中心点位置：
   math.sin（时间*（角/秒））*距离
   math.cos（....）

简单的演示：

var elem = $('h1:eq(0)') 
    .append('<span id="round" style="position:absolute;background-color:red;">&nbsp;</span>') 
    .css('position','relative') 
    .find('span#round'); 

var i = 0; 
setInterval(function(){  
    ++i; 
    elem.css({'left': Math.sin(i * 0.02) * 100, 'top': Math.cos(i * 0.02) * 100});}, 100); 

看到它在行动jsfiddle。

Answer 2

使用jquery.path插件，这里是一个demo。

（发现它来自另一个问题：How would you animate something so that it follows a curve?）