Sign Up to our social questions and Answers Engine to ask questions, answer people’s questions, and connect with other people.
Login to our social questions & Answers Engine to ask questions answer people’s questions & connect with other people.
Lost your password? Please enter your email address. You will receive a link and will create a new password via email.
Please briefly explain why you feel this question should be reported.
Please briefly explain why you feel this answer should be reported.
Please briefly explain why you feel this user should be reported.
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?
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/