JQuery learning notes: jQuery animation. For more information, see.
I. pre-defined animation Functions
1. Show Hidden Functions
Show (); // display elements (adding width, height, and opacity at the same time)
Hide (); // hide Elements
Execute hide () to hide the interface element, which is equivalent to displaying: none in the css style.
You can also add parameters to the function as follows:
Show ("slow ");
In addition to the slow value, you can also set it to normal or fast, representing 600,400,200 milliseconds respectively.
You can also add a specific time value. The details are as follows:
Slow (1000 );
This means that the time interval for completely displaying elements is 1000 milliseconds.
2. Opacity Function
FadeIn (); // gradually display elements (only increasing opacity)
FadeOut (); // gradually fades out elements
3. High-Width Function
SlideDown (); // gradually increase the element height (only increase the element height)
SlideUp (); // gradually shorten the element height
Ii. Custom Animation Functions
Animate (params, speed, callback );
Params: ing between a style attribute and a value
Speed: speed
Callback: The execution function when the animation is completed.
The style attribute value of params can be multiple or incremental or progressive.
Example:
The Code is as follows:
$ (Function (){
$ (# Id1). click (function (){
$ (This). animate ({left: "+ = 500px", height: "200px"}, 3000, function (){
Certificate (this).css ("border", "5px solid blue ")
})
})
})
1. Stop element Animation
Stop ();
End the animation currently being executed and immediately execute the animation defined below
2. Determine whether the animation is in the animation status
Is (": animate ")
3. Other animation Functions
Toggle (speed, callback); // switch the element status (high, width, and opacity) immediately. If hidden, switch to display. If displayed, switch to hide.
SildeToggle (speed, callback); // you can change the element status in height mode.
Fadeto (speed, opacity, callback); switch to the specified opacity value
