jquery slowly bites the special effects (eight)

1.show ([SPEED,[EASING],[FN]]) \ \ Show hidden matching elements

Speed: A string of three predetermined speeds ("slow", "normal", or "fast") or a millisecond value that represents the duration of the animation (for example: 1000)

easing:(Optional) is used to specify the toggle effect, the default is "Swing", the available parameters "linear"

$("p").show()

$("p").show("slow");

$("p").show("fast",function(){   $(this).text("Animation Done!"); });

$("p").show(4000,function(){   $(this).text("Animation Done..."); });

2.Hide ([SPEED,[EASING],[FN])//Hide displayed elements
Speed: A string of three predetermined speeds ("slow", "normal", or "fast") or a millisecond value that represents the duration of the animation (for example: 1000)
easing:(Optional) is used to specify the toggle effect, the default is "Swing", the available parameters "linear"

$("p").hide()

$("p").hide("slow");

$("p").hide("fast",function(){   alert("Animation Done."); });

3.Slidedown ([SPEED],[EASING],[FN])//The dynamic display of all matching elements by a height change (increased downward), optionally triggering a callback function after the display is complete

$(".btn2").click(function(){  $("p").slideDown();});

$("p").slideDown("slow");

$("p").slideDown("fast",function(){   alert("Animation Done."); });

4.slideUp ([SPEED,[EASING],[FN]])//The dynamic hiding of all matching elements by a height change (decrease up), optionally triggering a callback function after the hide is complete.

$("p").slideUp("slow");

$("p").slideUp("fast",function(){   alert("Animation Done."); });

5.slideToggle ([SPEED],[EASING],[FN])//Toggle the visibility of all matching elements through a height change and optionally trigger a callback function after the switch is complete

$("p").slideToggle("slow");

$ ("P"). Slidetoggle ("Fast", function () {   alert ("Animation Done");});

6.fadeIn ([SPEED],[EASING],[FN])//Through the change of opacity to achieve the fade of all matching elements, and after the completion of the animation can optionally trigger a callback function

$("p").fadeIn("slow");

("p").fadeIn("fast",function(){   alert("Animation Done."); });

7.fadeOut ([SPEED],[EASING],[FN])//fade out of all matching elements through changes in opacity, and optionally trigger a callback function after the animation is complete.

$("p").fadeOut("slow");

$("p").fadeOut("fast",function(){   alert("Animation Done."); });


8.FadeTo ([[[SPEED],OPACITY,[EASING],[FN]])//Adjust the opacity of all matching elements incrementally to the specified opacity, and optionally trigger a callback function after the animation is complete.

$("p").fadeTo("slow", 0.66);

$("p").fadeTo("fast", 0.25, function(){   alert("Animation Done."); });

9.fadeToggle ([SPEED,[EASING],[FN]])//Switch the fade-in and fade-out effect of all matched elements by changing the opacity, and optionally trigger a callback function after the animation is complete.

$("p").fadeToggle("slow","linear");

$("p").fadeToggle("fast",function(){   alert("Animation Done."); });

10.animate (PARAMS,[SPEED],[EASING],[FN])//function for creating custom animations.
Note: All specified properties must be in camel form, such as marginleft instead of Margin-left.

$("#go").click(function(){  $("#block").animate(
{     width: "90%",    height: "100%",     fontSize: "10em",     borderWidth: 10  }, 1000 );});

$("#right").click(function(){  $(".block").animate({left: ‘+50px‘}, "slow");});
$("#left").click(function(){  $(".block").animate({left: ‘-50px‘}, "slow");});

$("p").animate({   left: 50, opacity: ‘show‘ }, 500);

$("p").animate({   opacity: ‘show‘ }, "slow", "easein");

11.Stop ([clearqueue],[jumptoend])//stops all animations that are running on the specified element.

[Clearqueue],[gotoend]boolean,booleanV1.2

Clearqueue: If set to true, the queue is emptied. You can end the animation immediately.

Gotoend: Let the currently executing animation finish immediately, and reset the original style of show and hide, call the callback function, and so on.

[Queue],[clearqueue],[jumptoend]booleanV1.7

Queue: The names of the queues used to stop the animation

Clearqueue: If set to true, the queue is emptied. You can end the animation immediately.

Jumptoend: If set to true, the queue is completed. Animations can be completed immediately.

$("#stop").click(function(){  $("#box").stop();});

// 开始动画$("#go").click(function(){  $(".block").animate({left: ‘+200px‘}, 5000);});// 当点击按钮后停止动画$("#stop").click(function(){  $(".block").stop();});

11.Delay (duration,[queuename])//Set a delay to defer execution of items after the queue.

$(‘#foo‘).slideUp(300).delay(800).fadeIn(400);


12.Finish ([queue])//Stop the currently running animation, delete all queued animations, and complete all animations that match the element.

$ ("#complete"). Click (function () {$ ("div"). Finish ();});

13.jquery.fx.off//closes all animations on the page.

  jQuery.fx.off = true;  $("input").click(function(){ $("div").toggle("slow");  });

14.jquery.fx.interval//Setting the display frame rate for animations

JQuery.fx.interval = 100;$ ("Input"). Click (function () {  $ ("div"). Toggle (3000);});

jquery slowly bites the special effects (eight)