♦ jQuery Animate
♣ About jQuery Animate
Smooth change of state can occur with jQuery animate.Custom states can be defined with jQuery animate.
♣ jQuery animate() Syntax
Below is the representation of jQuery animate() Syntax.Basic Syntax
$(selector).animate({params},speed,callback);
selector: selection of element
params: the css styling attributes.
speed: time taken for executing the action, can be slow,fast or milliseconds
callback: function callback after the task has completed
params: the css styling attributes.
speed: time taken for executing the action, can be slow,fast or milliseconds
callback: function callback after the task has completed
♣ Example1: jQuery animate() Single Animation
Below shown is example of sliding box to right with increasing size and also decreasing the opacity.In this example, .
Example
Input:
Output:
♣ Example2: jQuery animate() Functional Animation
Function can be included just to perform multiple animation task in queue on occurence of an event.For sure other tasks can also be included in the function as well.
In this example, .
Example
Input:
Output:
♣ Example3: jQuery animate() Pre-Defined Attribute Animation
In-built jQuery animate() methods can be used for animating HTML elements.In this example, .
Example
Input:
Output: