jQuery
提供了4个方法进行HTML元素的渐变效果动画。
这四个方法的原型如下:
$(selector).fadeIn([duration] [,callback]);
$(selector).fadeOut([duration] [,callback]);
$(selector).fadeToggle([duration] [,callback]);
$(selector).fadeTo([duration], opacity [,callback]);
fadeIn()
方法用于淡入已隐藏的HTML元素。
fadeOut()
方法用于淡出正在显示的HTML元素。
fadeToggle()
方法用于在淡出和淡出之间切换。
fadeTo()
方法用于把HTML元素的opacity
切换到指定值。
duration
参数规定隐藏/显示的时间,此时有动画过程。其值可以是slow
、fast
或具体的毫秒。
opacity
取值在0-1之间。
示例:
$("p").fadeIn();
$("p").fadeIn(1000);
$("p").fadeIn(1000, function() {
//TODO
});
$("p").fadeOut();
$("p").fadeOut('slow');
$("p").fadeOut(1000, function() {
//TODO
});
$("p").fadeToggle();
$("p").fadeToggle('fast');
$("p").fadeToggle(1000, function() {
//TODO
});
$("p").fadeTo(1);
$("p").fadeTo('fast', 1);
$("p").fadeTo(1000, 1, function() {
//TODO
});