jQuery 效果 - 淡入淡出
使用 jQuery，您可以使元素淡入和淡出。
点击淡入/淡出面板
因为时间宝贵，我们提供快速简便的学习。
在 W3Schools，您可以用便捷易懂的方式学习所有您需要掌握的知识。
示例
jQuery fadeIn()
演示 jQuery fadeIn() 方法。
jQuery fadeOut()
演示 jQuery fadeOut() 方法。
jQuery fadeToggle()
演示 jQuery fadeToggle() 方法。
jQuery fadeTo()
演示 jQuery fadeTo() 方法。
jQuery 淡入淡出方法
使用 jQuery，您可以使元素淡入和淡出。
jQuery 具有以下淡入淡出方法：
fadeIn()fadeOut()fadeToggle()fadeTo()
jQuery fadeIn() 方法
jQuery fadeIn() 方法用于淡入隐藏的元素。
语法
$(选择器).fadeIn(速度,回调函数);
可选的 speed 参数指定了效果的持续时间。它可以接受以下值：“slow”（慢）、“fast”（快）或毫秒。
可选的回调函数参数是在淡入完成后执行的函数。
以下示例演示了带不同参数的 fadeIn() 方法：
示例
$("button").click(function(){
$("#div1").fadeIn();
$("#div2").fadeIn("slow");
$("#div3").fadeIn(3000);
});
自己动手试一试 »
jQuery fadeOut() 方法
jQuery fadeOut() 方法用于淡出可见的元素。
语法
$(选择器).fadeOut(速度,回调函数);
可选的 speed 参数指定了效果的持续时间。它可以接受以下值：“slow”（慢）、“fast”（快）或毫秒。
可选的回调函数参数是在淡入完成后执行的函数。
以下示例演示了带不同参数的 fadeOut() 方法：
示例
$("button").click(function(){
$("#div1").fadeOut();
$("#div2").fadeOut("slow");
$("#div3").fadeOut(3000);
});
自己动手试一试 »
jQuery fadeToggle() 方法
jQuery fadeToggle() 方法在 fadeIn() 和 fadeOut() 方法之间切换。
如果元素被淡出，fadeToggle() 会将它们淡入。
如果元素被淡入，fadeToggle() 会将它们淡出。
语法
$(选择器).fadeToggle(速度,回调函数);
可选的 speed 参数指定了效果的持续时间。它可以接受以下值：“slow”（慢）、“fast”（快）或毫秒。
可选的回调函数参数是在淡入完成后执行的函数。
以下示例演示了带不同参数的 fadeToggle() 方法：
示例
$("button").click(function(){
$("#div1").fadeToggle();
$("#div2").fadeToggle("slow");
$("#div3").fadeToggle(3000);
});
自己动手试一试 »
jQuery fadeTo() 方法
jQuery fadeTo() 方法允许淡入到指定的透明度（0 到 1 之间的值）。
语法
$(选择器).fadeTo(速度,透明度,回调函数);
必需的速度参数指定效果的持续时间。它可以接受以下值：“slow”、“fast”或毫秒。
fadeTo() 方法中的必需透明度参数指定淡入到指定的透明度（0 到 1 之间的值）。
可选的回调函数参数是在函数完成执行后要执行的函数。
以下示例演示了带不同参数的 fadeTo() 方法：
示例
$("button").click(function(){
$("#div1").fadeTo("slow", 0.15);
$("#div2").fadeTo("slow", 0.4);
$("#div3").fadeTo("slow", 0.7);
});
自己动手试一试 »
jQuery 练习
jQuery Effects 参考
要查看所有 jQuery 效果的完整概述，请访问我们的 jQuery 效果参考。
