jquery notes (effects)

Show/Hide:

$ (selector). Hide (speed, function ()): Hidden

$ (selector). Show (speed, Function ()): Hidden

$ (selector). Toggle (speed, function ()): Show/Hide Toggle

Fade In/Fade out:

$ (selector). FadeIn (speed, Function ()): Fade In, you must first hide the element (Display:none)

$ (selector). FadeOut (speed, Function ()): Fade out, that is, slowly hide

$ (selector). Fadetoggle (speed, Function ()): fade-in/fade-out toggle

$ (selector). FadeTo (speed,opacity,function ());: method allows the gradient to a given opacity (values between 0 and 1)

Sliding:

$ (selector). Slidedown (speed,function ()): Swipe down

$ (selector). Slideup (speed,function ()): Swipe up

$ (selector). Slidetoggle (speed,function ()): Toggle

Animation:

$ (selector). Animate ({params}, Speed,function ()): When using animate (), all property names must be written using the Camel notation. For example, you must use Paddingleft instead of padding-left, use marginright instead of margin-right, and so on. At the same time, color animations are not included in the core JQuery library. and CSS3 animation slightly different is a person feel better control, will not return to the original state.

Relative values can be taken:

$ ("button"). Click (function () {
$ ("div"). Animate ({
Left: ' 250px ',
Height: ' +=150px ',
Width: ' +=150px '
});
});

Use predefined values: Hide (), show (), Toggle ()

$ ("button"). Click (function () {
$ ("div"). Animate ({
Height: ' Toggle '
});
});

Using queues:

$ ("button"). Click (function () {
var div=$ ("div");
Div.animate ({height: ' 300px ', opacity: ' 0.4 '}, "slow");
Div.animate ({width: ' 300px ', opacity: ' 0.8 '}, "slow");
Div.animate ({height: ' 100px ', opacity: ' 0.4 '}, "slow");
Div.animate ({width: ' 100px ', opacity: ' 0.8 '}, "slow");
});

Stop Animation:

The Stop () method applies to all JQuery effect functions, including sliding, fading, and custom animations.

$(selector). Stop (Stopall,gotoend): The optional StopAll parameter specifies whether the animation queue should be cleared. The default is false, which stops only active animations, allowing any queued animation to be executed backwards. The optional gotoend parameter specifies whether to complete the current animation immediately. The default is False. Therefore, by default, stop () clears the current animation specified on the selected element.Method Link:$ ("#p1"). CSS ("Color", "red"). Slideup (+). Slidedown (2000);

jquery notes (effects)