jQuery效果

1、隐藏/显示：隐藏、显示、切换，滑动，淡入淡出，以及动画，哇哦！

　　jQuery hide()和show()隐藏和显示html元素：　　　　

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

　　　$("#show").click(function(){
  　　　　$("p").show();
　　　});
　　jQuery toggle():使用toggle()方法来切换hide()和show()方法。　　　　

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

　　　　$("#show").click(function(){
  　　　　　$("p").show();
　　　　});
　　　　以上代码使用toggle()代替：　　　　

　　　　　$("button").click(function(){
  　　　　　　$("p").toggle();
　　　　　});
2、jQuery效果-淡入淡出
　　jQuery Fading方法：

• • fadeIn()：用于淡入已隐藏的元素
  • fadeOut()：用于淡出可见元素
  • fadeToggle()：在fadeIn()与fadeOut()方法之间进行切换
  • fadeTo()：允许渐变为给定的不透明度（值介于0与1之间）

　　jQuery fadeIn()方法：

　　　　语法：$(selector).fadeIn(speed,callback);

　　　　fadeIn()实例：　　　　

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

　　jQuery fadeOut()方法：

　　　　语法：$(selector).fadeOut(speed,callback);

　　　　　　可选的speed参数退订效果的时长。它可以取一下值：‘slow’，‘fast’或毫秒；

　　　　　　可选的callback参数是fading完成后执行的函数名称。

　　　　实例：　　　　　　

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

　　jQuery fadeToggle()方法：

　　　　语法：$(selector).fadeToggle(speed,callback);

　　　　实例：　　

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

　　jQuery fadeTo()

　　　　语法：$(selector).fadeTo(speed,opacity,callback);

　　　　　　必要的speed参数规定效果的市场。它可以取以下值：‘slow’，‘fast’或毫秒。

　　　　　　fadeTo()方法中必须的opacity参数将淡入淡出效果设置为设定的不透明度（值介于0与1之间）。

　　　　实例：　　　　　　

　　　　　　$("button").click(function(){

　　　　　　　　$("#div1").fadeTo("slow",0.15);
　　　　　　　　$("#div2").fadeTo("slow",0.4);
　　　　　　　　$("#div3").fadeTo("slow",0.7);
　　　　　　});
3、jQuery滑动：
　　jQuery滑动方法：

• • slideDown()：用于向下滑动元素
  • slideUp()：用于向上滑动元素
  • slidetoggle()：在slideDown()与slideUp()方法之间进行切换。

　　jQuery slideDown()方法：

　　　　语法：$(selector).slideDown(speed,callback);

　　　　例子：　　　　

　　　　　　$("#flip").click(function(){
  　　　　　　$("#panel").slideDown();
　　　　　　});
　　　　slideUp()和slideToggle()用法相同
4、jQuery效果-动画
　　jQuery animate()方法用于创建自定义动画。
　　语法：$(selector).animate({params},speed,callback);
　　　　必需的params参数定义形成动画的css属性；
　　　　可选的speed参数规定效果的时长。他可以取以下值：‘slow’，‘fast’或毫秒；
　　　　可选的callback参数是动画完成后执行的函数名称。
　　例子：把<div>元素移动到左边，直到left属性等于250像素为止：　　　　
　　　　$("button").click(function(){
　　　　　　$("div").animate({left:'250px'});
　　　　});