Posts

Showing posts from August, 2012

Javascript, animation and easing functions

I recently had to create an animation, which obey to the laws of physics, using javascript and HTML5. Among the gravity and free falling, one of these animations had to also apply sort of bouncing and elastic laws. After creating it first with CSS3 and HTML, we realized that most of the Android devices does not support it fully yet. Especially versions prior to Ice Cream Sandwich, such as Android 2.1, 2.2, 2.3 and lower (Froyo and its siblings). So, I had to transfer everything into HTML5 Canvas, and instead of applying the css-transitions, I had to implements everything alone. The first website I encountered and would like to highly recommend is Timothee Groleau's easing generator which can be found here : http://timotheegroleau.com/Flash/experiments/easing_function_generator.htm Originally made for Flash - but can easily adopted to Javascript HTML5 too. The output of his generator is basically a function describes a certain movement of an object. Such movement may b