jQuery有一些易于实现的效果来创建动画。
hide()和show()方法用于隐藏和显示所选元素。
toggle()方法用于在隐藏和显示元素之间切换。
例如:
$(function() { $("p").click(function() { $("div").toggle(); }); });
hide / show / toggle方法可以带一个速度参数,以毫秒为单位指定动画速度。
例如,我们为toggle方法传入一个1000毫秒的参数:
$(function() { $("p").click(function() { $("div").toggle(1000); }); });
hide / show / toggle方法还有第二个可选参数可选,这是一个在动画完成后执行回调的方法。
与hide / show方法类似,jQuery提供了fadeIn / fadeOut方法,它将一个元素淡入和淡出显示。
和toggle()方法在隐藏和显示之间切换一样,fadeToggle()方法可以在淡入淡出中进行切换。
让我们看看fadeToggle()的实例:
$(function() { $("p").click(function() { $("div").fadeToggle(1000); }); });
和toggle()一样,fadeToggle()也具有两个可选参数:speed和callback。
用于衰落的另一种方法是fadeTo(),它允许衰减到给定的不透明度(0和1之间的值)。 例如:$("div").fadeTo(1500,0.7);
$("p").fadeTo( , );
slideUp()和slideDown()方法用于在元素上创建滑动效果。
再次,类似于以前的切换方法,slideToggle()方法提供在滑动效果之间切换,一样也有两个可选参数:速度和回调。
例如:
$(function() { $("p").click(function() { $("div").slideToggle(500); }); });
$("p"). (function() { ("div").slideDown( ); });