如何创建一个平滑的动画,以缓解目标

Dan*_*cia 3 javascript animation requestanimationframe

如何创建一个平滑的动画,当它改变位置时,它会向目标缓和?

正如这个jsFiddle所示,动画停止或被阻挡,moveTarget()而不是继续朝向新的目标坐标.

实现预期效果的理想实施/结构是什么?

Dan*_*cia 8

好的,在这里回答我自己的问题以防其他人有这个问题.

而不是每次点火都计算change(change = finish - begin)moveTarget(),而是不断计算onEnterFrame().所以moveTarget()只负责获得新的X和Y职位.

这允许值朝向目标缓和.

我还将缓动函数的时间值永久设置为1:

easeIn(1, begin, change, duration);

示例答案在此修订版jsFiddle:http://jsfiddle.net/dannygarcia/LqP2R/45/