如何创建平滑的动画以轻松实现目标
如何创建一个平滑的动画，随着目标位置的改变而逐渐靠近目标？
正如这个jsFiddle所示，动画在moveTarget()期间停止或被阻止而不是继续朝着新的目标坐标前进。
达到预期效果的理想实现/结构是什么？
How can I create a smooth animation that eases in toward a target as it changes position?
As this jsFiddle shows, the animation stops or gets blocked during moveTarget() instead of continuing toward the new target coordinates.
What would be the ideal implementation / structure to achieve the desired effect?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
好的，在这里回答我自己的问题，以防其他人遇到这个问题。
不是每次
moveTarget()触发时都计算change(change = finish - begin)，而是在onEnterFrame( ）。所以moveTarget()只负责获取新的 X 和 Y 位置。这使得值能够逐渐接近目标。
我还将缓动函数的时间值永久设置为始终为 1：
easeIn(1, begin,change,uration);示例答案在此修订版 jsFiddle 中：http://jsfiddle.net/dannygarcia/LqP2R/45/
Ok, answering my own question here in case anyone else has this problem.
Instead of calculating
change(change = finish - begin) each timemoveTarget()fires, it is constantly being calculated inonEnterFrame(). SomoveTarget()only responsible for getting the new X and Y positions.This allows the values to ease toward the target.
I also permanently set the time value of the easing function to always be 1:
easeIn(1, begin, change, duration);The example answer is in this revision jsFiddle: http://jsfiddle.net/dannygarcia/LqP2R/45/