jQuery之动画效果大全

下面介绍了几种动画效果的方法，具体如下：

1、show()显示效果

语法：show(speed,callback)　　Number/String,Function　speend为动画执行时间，单位为毫秒。也可以为slow”,”normal”,”fast”　callback可选,为当动画完成时执行的函数。

 show(speed,[easing],callback)　　Number/String　　easing默认是swing,可选linear;　　　　

$("#div1").show(3000,function(){ alert("动画显示完成!"); });　　

2、hide()隐藏效果

语法:hide(speed,callback)　　Number/String,Function

         hide(speed,easing,callback)　　Number/String　　　

 $("#div1").hide(3000,function(){ alert("动画隐藏完成") });

 3、toggle()隐藏显示自动切换，当目前为显示则隐藏，当目前为隐藏则显示

语法：toggle(speed,callback)　　Number/String,Function

　　　toggle(speed,callback)　　Number/String,String,Function　　  

 $("#div1").toggle(3000,function(){ alert("动画效果切换完成") });

4、slideDown()向下显示，slow()是水平与垂直方向同时展开，而slideDown是仅仅在垂直方向向下展开

语法:slideDown(speed,callback)　　Number/String,Function

　　 slideDown(speed,[easing],callback)　　Number/String,Function　　　　

$("#div1").slideDown(3000,function(){ alert("向下展开显示成功!"); });

 5、slideUp()向上隐藏,　　hide()是水平与垂直两个方向的，而slideUp()仅仅是垂直方向向上收起隐藏

语法:slideUp(speed,callback)　　Number/String,Function

　　  slideUp(speed,[easing],callback)　　Number/String,String,Function　　　　

 $("#div1").slideUp(3000,function(){ alert("向上收起隐藏成功!"); })

6、slideToggle垂直方向上切换,toggle是水平与垂直两个方向上的，而slideToggle是仅仅垂直方向的。

语法:slideToggle(speed,callback)　　Number/String,Function

        slideToggle(speed,[easing],callback)　　Number/String,String,Function　　　

 $("#div1").slideToggle(3000,function(){ alert("水平方向上切换成功"); });

7、fadeIn() 以改变透明度来显示

语法：fadeIn(speed,callback)　　　　Number/String,Function

　　　fadeIn(speed,[easing],callback)　　Number/String,Function　　　　

$("#div1").FadeIn(3000,function(){ alert("淡入显示成功!"); });

8、fadeOut() 以改变透明度来隐藏

语法：fadeOut(speed,callback)　　   Number/String,Function