jQuery的淡入淡出

fade方法
有四个方法
fadeIn()
fadeOut()
fadeToggle()
fadeTo()

fadeIn()

淡入已隐藏的元素

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

语法格式

$(selector).fadeIn(speed,callback);

speed
可选参数，规定隐藏/显示的速度
可以取以下值：”slow”、”fast”或毫秒

callback
可选参数，隐藏或显示完成后所执行的函数名称
类似于回调函数

fadeOut()

淡出可见元素

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

语法格式

$(selector).fadeOut(speed,callback);

同上

fadeToggle()

在fadeIn()与fadeOut()方法之间进行切换
如果元素已淡出，则fadeToggle()会向元素添加淡入效果
如果元素已淡入，则fadeToggle()会向元素添加淡出效果

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

语法格式

$(selector).fadeToggle(speed,callback);

同上

fadeTo()

渐变为给定的不透明度，值介于0与1之间

$("button").click(function(){
  $("#div1").fadeTo("slow",0.15);
  $("#div2").fadeTo("slow",0.4);
  $("#div3").fadeTo("slow",0.7);
});

语法格式

$(selector).fadeTo(speed,opacity,callback);

Speed、callback同上
Opacity
必选参数，将淡入淡出效果设置为，给定的不透明度，值介于0与1之间