Some common special effect methods and examples that jquery must know (sorted out)

1. jQuery fadeIn () is used to fade hidden elements.
Syntax:
$ (Selector). fadeIn (speed, callback );
Instance:
Copy codeThe Code is as follows:
$ ("Button "). click (function () {$ ("# div1 "). fadeIn (); $ ("# div2 "). fadeIn ("slow"); $ ("# div3 "). fadeIn (3000 );});

2. The jQuery fadeOut () method is used to fade out visible elements.
Syntax:
$ (Selector). fadeOut (speed, callback );

3. The jQuery fadeToggle () method can be switched between the fadeIn () and fadeOut () methods.
If the element has faded out, fadeToggle () adds a fade-in effect to the element.
If the element is fade in, fadeToggle () adds a fade out effect to the element.
Syntax:
$ (Selector). fadeToggle (speed, callback );
Instance:
Copy codeThe Code is as follows:
$ ("Button "). click (function () {$ ("# div1 "). fadeToggle (); $ ("# div2 "). fadeToggle ("slow"); $ ("# div3 "). fadeToggle (3000 );});

Here I would like to say that jquery generally has an inverse reversible method to achieve the synthesis of a single method. This is also true for the top and bottom moves below.

4. Syntax:
$ (Selector). fadeTo (speed, opacity, callback );
The required speed parameter specifies the duration of the effect. It can take the following values: "slow", "fast", or millisecond.
The required opacity parameter in the fadeTo () method sets the fade-in and fade-out effect to a given opacity (value between 0 and 1 ). Instance
Copy codeThe Code is as follows:
$ ("Button"). click (function (){
$ ("# Div1"). fadeTo ("slow", 0.15 );
$ ("# Div2"). fadeTo ("slow", 0.4 );
$ ("# Div3"). fadeTo ("slow", 0.7 );
});

5. The jQuery slideDown () method is used to slide down an element.
Syntax:
$ (Selector). slideDown (speed, callback );
$ ("# Flip"). click (function () {$ ("# panel"). slideDown ();});

6. The jQuery slideUp () method is used to move an element up.
Syntax:
$ (Selector). slideUp (speed, callback );
The optional speed parameter specifies the duration of the effect. It can take the following values: "slow", "fast", or millisecond.
The optional callback parameter is the name of the function executed after sliding.

7. The jQuery slideToggle () method can be switched between the slideDown () and slideUp () methods.
If the elements slide down, slideToggle () can slide them up.
If the elements slide up, slideToggle () can slide down them.
$ (Selector). slideToggle (speed, callback );

8. The jQuery animate () method is used to create custom animations.
Syntax:
$ (Selector). animate ({params}, speed, callback );
The required params parameter defines the CSS attributes of the animation.
The optional speed parameter specifies the duration of the effect. It can take the following values: "slow", "fast", or millisecond.
The optional callback parameter is the name of the function executed after the animation is completed.
You can also define a relative value (this value is relative to the current value of the element ). + = Or-= must be added before the value:
You can also define a group of animate to implement the queue function.
The following example demonstrates the simple application of the animate () method. It moves the <div> element to the left until the left attribute is 250 pixels:
Instance
Copy codeThe Code is as follows:
$ ("Button"). click (function () {$ ("div"). animate ({left: '250px '});});

9. The jQuery stop () method is used to stop an animation or effect before they are completed.

10. Call the Callback function when animation 100% is complete.
Typical Syntax:
$ (Selector). hide (speed, callback)

11. jQuery method Link
Some elements only need to be retrieved once, so you can append them using links.
Is the method. For example
$ ("# P1" ).css ("color", "red"). slideUp (2000). slideDown (2000 );