"Animate" an element, by changing its height:
The animate() method performs a custom animation of a set of CSS properties.
This method changes an element from one state to another with CSS styles. The CSS property value is changed gradually, to create an animated effect.
Only numeric values can be animated (like "margin:30px"). String values cannot be animated (like "background-color:red").
Tip: Use "+=" or "-=" for relative animations.
| Parameter | Description |
|---|---|
| styles | Required. Specifies one or more CSS properties/values to animate. Note: The property names must be camel-cased when used with the animate() method: You will need to write paddingLeft instead of padding-left, marginRight instead of margin-right, and so on. Properties that can be animated:
|
| speed | Optional. Specifies the speed of the animation. Default value is 400
milliseconds Possible values:
|
| easing | Optional. Specifies the speed of the element in different points of the
animation. Default value is "swing". Possible values:
|
| callback | Optional. A function to be executed after the animation completes. To learn more about callback, please read our jQuery Callback chapter |
| Parameter | Description |
|---|---|
| styles | Required. Specifies one or more CSS properties/values to animate (See possible values above) |
| options | Optional. Specifies additional options for the animation. Possible values:
|
Using animate() with a callback function
How to use animate() with a callback function that repeats the animation.
Your message has been sent to W3Schools.
jQuery Effect Methods