Write the animate function in jquery?
The animate function is used to apply the custom animation effect to elements.
-Syntax:
$(selector).animate({params}, [duration], [easing], [callback])
- “param” defines the CSS properties on which you want to apply the animation.
- “duration” specify how long the animation will run. It can be one of following values : “slow”, “fast”, “normal” or milliseconds
- “easing” is the string which specify the function for the transition.
- “callback” is the function which we want to run once the animation effect is complete.
For example
<div id=”clickToAnimate”>
Click Me
</div>
<div id=”mydiv” style=”width:200px; height:300px; position: relative; right: 20px;”>
</div>
Following is the jQuery to animate opacity, left offset, and height of the mydiv element
$(‘# clickToAnimate’).click(function() {
$(‘#book’).animate({
opacity: 0.30,
left: ‘+=20’,
height: ‘toggle’
}, 3000, function() {
// run after the animation complete.
});
});
See the following links also:
- What is jQuery explain in four steps?
- What is jQuery Selectors? Give some examples.
- In what way can we give fade effect in jQuery?
- Write the animate function in jquery?
- What are the advantages of jquery?
- What is .siblings() method in jQuery ?
- How to mention the css width in jquery code?
- Explain bind() vs live() vs delegate() methods in jquery?
- How to use of jQuery.data()?
- How to write the each() function in jQuery?