jQuery 入门教程(六): 淡入淡出效果

jQuery 入门教程(6): 淡入淡出效果

jQuery 提供了下面几种方法可以实现显示的淡入淡出效果：

• fadeIn()
• fadeOut()
• fadeToggle()
• fadeTo()

  fadeIn()方法

  fadeIn() 实现淡入效果，其基本语法如下：

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

  可选参数speed给出了淡入效果的时间，可以使用 “slow”,”fast” 或是数值（微秒）
  第二个可选参数为回调函数，在fadeIn()方法结束后调用。

  第二个可选参数为回调函数，在fadeIn()方法结束后调用。
  其基本语法如下：
  $(selector).fadeToggle(speed,callback);
  可选参数speed给出了淡入效果的时间，可以使用 “slow”,”fast” 或是数值（微秒）
  第二个可选参数为回调函数，在fadeIn()方法结束后调用。
  下面例子，点击按钮之后，可以交替淡出淡入三个矩形。
  fadeTo()方法
  fadeTo() 实现淡化到指定的透明度，其基本语法如下：
  $(selector).fadeTo(speed,opacity,callback);
  必需参数speed给出了淡入效果的时间，可以使用 “slow”,”fast” 或是数值（微秒）
  第二个必须参数为透明度，值域为0到1之间。
  可选参数为回调函数，在fadeIn()方法结束后调用。
  $("button").click(function(){  $("#div1").fadeTo("slow",0.15);  $("#div2").fadeTo("slow",0.4);  $("#div3").fadeTo("slow",0.7);});