>[danger] 隱藏和顯示 ~~~ 節點對象.hide() ~~~ ~~~ 節點對象.show() ~~~ >[info] 參數:"fast","normal","slow",分別對象0.2秒,0.4,秒和0.6秒,也可以設置具體的時間，毫秒為單位 Eg: ~~~ <script> $('input[type=button]').click(function(){ $('li').hide(5000); }) $('input[type=button]').click(function(){ $('div').show(5000); }) </script> ~~~ >[danger] 淡入和淡出 ~~~ 節點對象.fadeIn(淡入時間) ~~~ ~~~ 節點對象.fadeOut(淡入時間) ~~~ ~~~ //自動判斷當前元素時隱藏還是顯示狀態，如果是隱藏狀態，則先使用淡入效果，再淡出。如果是顯示狀態，則先使用淡出效果，再淡入。 節點對象.fadeToggle(時間,function(){ 執行代碼 }) ~~~ ~~~ //將頁面元素透明度變化到指定的值 節點對象.fadeTo(時間,opacity,function(){ 執行代碼 }) ~~~ >[danger] 滑動效果 ~~~ //收起效果 節點對象.slideUp(speed,function(){ 執行代碼 }) ~~~ ~~~ //下拉效果 節點對象.slideDown(speed,function(){ 執行代碼 }) ~~~ ~~~ //自動判斷當前元素是否是顯示還是隱藏狀態，如果元素時顯示狀態，則先執行下拉效果，再收起。如果元素是顯示狀態，則先執行收起效果，再下拉 節點對象.slideToggle(speed,function(){ 執行代碼 }) ~~~ >[danger] 停止動畫效果 ~~~ 節點對象.stop() ~~~ Eg: ~~~ $('btn').toggle(function(){ $('.div').sileUp(1000);},function(){ //下拉菜單收起 $('.div').stop(); //收起過程中再次點擊效果停止 }) ~~~ >[danger] 解決多次點擊后，動畫效果仍然繼續的問題 Eg: ~~~ $('btn').toggle(function(){ $('.div').filter(':not(:animated)').sileUp(1000); },function(){ $('.div').filter(':not(:animated)').sileDown(1000); }) ~~~ >[danger] 自定義動畫 ~~~ 節點對象.animate(style,speed,function(){ 執行代碼 }) //Sytle:指定變化后的css樣式，json對象格式 //Speed：設置效果變化時間 //Func：動畫效果完成后，執行的回調 ~~~