jQuery(2)--效果

隐藏/显示

jQuery hide() 和 show()
通过 jQuery，您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素：

$("#hide").click(function(){
  $("p").hide();
});

$("#show").click(function(){
  $("p").show();
});

jQuery toggle()
通过 jQuery，您可以使用 toggle() 方法来切换 hide() 和 show() 方法。
显示被隐藏的元素，并隐藏已显示的元素：

$("button").click(function(){
  $("p").toggle();
});

 淡入淡出　　

 

jQuery fadeIn() 用于淡入已隐藏的元素。　

$("button").click(function(){
  $("#div1").fadeIn();
  $("#div2").fadeIn("slow");
  $("#div3").fadeIn(3000);
});

jQuery fadeOut() 方法用于淡出可见元素。

$("button").click(function(){
  $("#div1").fadeOut();
  $("#div2").fadeOut("slow");
  $("#div3").fadeOut(3000);
});

jQuery fadeToggle() 方法可以在 fadeIn() 与 fadeOut() 方法之间进行切换。

$("button").click(function(){
  $("#div1").fadeToggle();
  $("#div2").fadeToggle("slow");
  $("#div3").fadeToggle(3000);
});

jQuery 滑动方法可使元素上下滑动。　　

jQuery 拥有以下滑动方法：
slideDown()
slideUp()
slideToggle()

$("#flip").click(function(){
  $("#panel").slideToggle();
});

jQuery stop() 方法用于在动画或效果完成前对它们进行停止；

jQuery  Callback 函数在当前动画 100% 完成之后执行。　　

jQuery  Chaining 允许我们在一条语句中允许多个 jQuery 方法（在相同的元素上）。

下面的例子把 css(), slideUp(), and slideDown() 链接在一起。"p1" 元素首先会变为红色，然后向上滑动，然后向下滑动：

$("#p1").css("color","red").slideUp(2000).slideDown(2000);