jQuery offers many useful utilities to achieve animation effects, thus empowering developers to build rich animated pages for a better interactive experience for the web users.
Some useful inbuilt functions in jQuery that we will explore in this chapter for achieving animation effects are:
animate ( properties, [ duration ], [ easing ], [ complete ] ):
This method allows us to create custom animation effects on any numeric css property. The parameters supported by this method are:
properties: This is the map of css properties to animate, for e.g. width, height, fontSize, borderWidth, opacity, etc.
duration: This is the duration of the animation in milliseconds. The constants
slow
andfast
can be used to specify the durations, and they represent 600 ms and 200 ms respectively.easing: This is the easing function to use. Easing indicates the speed of the animation at different points during the animation. jQuery provides inbuilt
swing
andlinear
easing functions. Various plugins...