jQuery - 效果（四）之 淡入淡出

本文目录：

1. fadeIn()；
2. fadeOut()；
3. fadeToggle()；
4. fadeTo()。

fadeIn(speed, callback)

给所选元素添加淡入效果。

参数	类型	描述
speed	String/Number	可选。动画时长，预设值为 "slow"（600）、"normal"（默认值，400）、"fast"（200），也可自定义动画时长，单位为毫秒（如：1000）。
callback	Function()	可选。动作完成后执行的函数。

fadeOut(speed, callback)

给所选元素添加淡出效果。

参数	类型	描述
speed	String/Number	可选。动画时长，预设值为 "slow"（600）、"normal"（默认值，400）、"fast"（200），也可自定义动画时长，单位为毫秒（如：1000）。
callback	Function()	可选。动作完成后执行的函数。

fadeToggle(speed, easing, callback)

fadeToggle() 方法是 fadeIn() 方法和 fadeOut() 方法的结合，既能给元素添加淡入效果，又能给元素添加淡出效果。

参数	类型	描述
speed	String/Number	可选。动画时长，预设值为 "slow"（600）、"normal"（默认值，400）、"fast"（200），也可自定义动画时长，单位为毫秒（如：1000）。
easing	String	可选。过渡动画的类型，预设值为 "linear"、"swing"（默认值）。
callback	Function()	可选。动作完成后执行的函数。

fadeTo(speed, opacity, easing, callback)

fadeTo() 方法允许所选元素淡入/淡出至给定的不透明度（值介于 0 与 1 之间）。

参数	类型	描述
speed	String/Number	可选。动画时长，预设值为 "slow"（600）、"normal"（默认值，400）、"fast"（200），也可自定义动画时长，单位为毫秒（如：1000）。
opacity	Number	必选。不透明度，取值范围：0 至 1。
easing	String	可选。过渡动画的类型，预设值为 "linear"、"swing"（默认值）。
callback	Function()	可选。动作完成后执行的函数。

代码：

    
    
    
    



淡入
淡出
淡入/淡出
淡入/淡出至给定透明度

效果演示：

淡入淡出.gif