jQuery 動畫方法
阿新 • • 發佈:2020-08-16
- 隱藏與顯示(利用了display屬性)
- hide(); 隱藏 如: $("p").hide(); 下同
- show(); 顯示
- 淡入與淡出(利用display屬性,可設引數設定快慢或時間)
- fadeIn(); 淡入已隱藏元素
- fadeOut(); 淡出可見元素
- fadeToggle(); 在fadeIn()和fadeOut()之間進行切換
- fadeTo(); 允許漸變為給定不透明度
- fadeTo("slow",0.15)
- 滑動
- slideDown() 下滑
- slideUp 上滑
- slideToggle() 在上滑和下滑之間切換
- 自定義動畫
- animate() 方法用於自定義動畫
1 $("button").click(function(){ 2 $("div").animate({ 3 left:'250px', opacity:'0.5', height:'150px', width:'150px' 4 }); 5 });
- stop() 停止動畫效果
- 在動畫完成之前,適用於所有jQuery效果函式,包括滑動,淡入淡出和自定義動畫。
- 寫在動畫之前
- 例如 $("p").stop().slideDown()
- 回撥函式
- 當前動畫100%完成之後執行
1 $("button").click(function(){ 2 $("p").hide("slow",function(){ 3 alert("段落現在被隱藏了"); 4 }); 5 });