一、jQuery 中的動畫: 隱藏和顯示

（1）hide()

? ? ?在 HTML 文檔中, 為一個元素調用 hide() 方法會將該元素的 display 樣式改為 none. 代碼功 能同 css(“display”, “none”);

（2）show()

? ? 將元素的 display 樣式改為先前的顯示狀 態.

以上兩個方法在不帶任何參數的情況下, 作用是立 即隱藏或顯示匹配的元素, 不會有任何動畫. 可以 通過制定速度參數使元素動起來.

以上兩個方法會同時減少(增大)內容的高度, 寬度 和不透明度.

?

二、jQuery 中的動畫(2)

（1）fadeIn(), fadeOut()只改變元素的透明度.

? ? ? fadeOut() 會在指定的一段時間內降低元素的 不透明度, 直到元素完全消失. fadeIn() 則相反.

（2）slideDown(), slideUp(): 只會改變元素的高度

? ? ?如果一個元素的 display 屬性為 none, 當調用 slideDown() 方法時, 這個元素將由上至下延伸 顯示. slideUp() 方法正好相反, 元素由下至上縮 短隱藏.

?

三、jQuery 中的動畫(3)

（1）toggle(): 切換元素的可見狀態: 如果元素時 可見的, 則切換為隱藏; 如果元素時隱藏的, 則切換為可見的.

（2）slideToggle(): 通過高度變化來切換匹配元 素的可見性.

（3）fadeTo(): 把不透明度以漸近的方式調整到 指定的值(0 – 1 之間).

?

?

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的jQuery 基础教程 （五）之使用jQuery创建动画效果的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。