Rumah >hujung hadapan web >tutorial js >Contoh analisis kaedah berkaitan kesan animasi jQuery_jquery
Contoh dalam artikel ini menerangkan kaedah yang berkaitan dengan kesan animasi jQuery. Kongsikan dengan semua orang untuk rujukan anda, butirannya adalah seperti berikut:
1. tunjukkan() kesan paparan
Syntax: show(speed,callback) Nombor/String, Kelajuan fungsi ialah masa pelaksanaan animasi, dalam milisaat. Ia juga boleh menjadi "perlahan", "biasa", "cepat".
tunjukkan(kelajuan,[peringan],panggilan balik) Nombor/String pelonggaran lalai kepada ayunan, linear pilihan;
2. hide() kesan tersembunyi
Sintaks: sembunyikan(kelajuan, panggil balik) Nombor/String, Fungsi
sembunyikan (kelajuan, pelonggaran, panggil balik) Nombor/String
togol(kelajuan, panggil balik) Nombor/String, Rentetan, Fungsi
Sintaks: slideDown(kelajuan, panggil balik) Nombor/String, Fungsi
slideDown(kelajuan,[meringankan],panggilan balik) Nombor/String,Fungsi
slideUp(kelajuan,[meringankan],panggilan balik) Nombor/Rentetan, Rentetan, Fungsi
slideTogol(kelajuan,[meringankan],panggilan balik) Nombor/Rentetan, Rentetan, Fungsi
Sintaks: fadeIn(kelajuan, panggil balik) Nombor/String, Fungsi
fadeIn(kelajuan,[meringankan],panggilan balik) Nombor/String,Fungsi
fadeOut(kelajuan,[meringankan],callcack) Nombor/Rentetan, Rentetan, Fungsi
Sintaks: fadeToggle(kelajuan, panggil balik) Nombor/String, Fungsi
pudarTogol(kelajuan,[meringankan],panggil balik) Nombor/String,Fungsi
Sintaks: fadeTo(kelajuan, panggil balik) Nombor/String, Fungsi
fadeTo([speed],opacity,[esing],[fn]) Number/String,Float,String,Function
Sintaks: bernyawa (param, kelajuan, pelonggaran, parameter gaya, masa, pilihan, fungsi
Param hendaklah disertakan dalam kurungan segi empat sama dan anda boleh menggunakan parameter gaya css. Ambil perhatian bahawa Undang-undang Unta harus digunakan, sebagai contoh, saiz fon hendaklah ditulis sebagai Saiz fon. Kecerunan warna tidak disokong.
Kedudukan latar belakang
borderWidth
borderBottomWidth
borderLeftWidth
sempadanRightWidth
borderTopWidth
borderSpacing
margin
marginBottom
marginKiri
marginRight
marginTop
outlineWidth
pelapik
paddingBottom
paddingLeft
paddingRight
paddingTop
ketinggian
lebar
maxHeight
maxWidth
minHeight
maxWidth
fon
Saiz fon
bawah
kiri
betul
atas
letterSpacing
wordSpacing
lineHeight
textIndent
12 stop() menghentikan animasi dijalankan
stop([clearQueue],[gotoEnd]); Kedua-dua parameter adalah nilai Boolean yang menunjukkan sama ada untuk menghentikan pelaksanaan animasi, dan yang kedua menunjukkan sama ada ia akan segera berubah kepada keadaan siap jika ia berhenti kepada Tidak untuk kekal dalam keadaan separuh dilaksanakan.
$("#div1").hide(5000) //此动画正在执行 $("#div1").stop(); //上一行代码指定的动画停止在一半状态 $("#div1").stop(true,true); //停止当前动画,同时动画切换到完成执行状态。
13. kelewatan() Perlaksanaan animasi tertunda Apabila animasi berhenti(), anda juga boleh menggunakan kelewatan() untuk menangguhkan pelaksanaan. Pelaksanaan diteruskan di mana ia berhenti. Sudah tentu, tidak mungkin untuk meneruskan pelaksanaan menggunakan kaedah asal, tetapi tiada kesan kelewatan.
kelewatan(tempoh,[Nama giliran]) Tetapkan nilai kelewatan untuk melaksanakan animasi Integer, Rentetan
$(function(){ jQuery.fx.off = true; //属性在事件外面,对页面加载后执行的所有动画有效 $("#div1").click(function(){ //属性如果写在这里,仅仅对当前点击事件无效,不影响其他事件的动画 $("#div1").hide(3000); //注意由于jQuery.fx.off设置为了true,因此3000毫秒失效,相当于hide(); }); })
$(function(){ jQuery.fx.interval = 1000; $("#div1").click(function(){ $("#div1").hide(3000); //jQuery.fx.interval设置为1000,也就是1秒钟,改变一次效果。 }); })Saya harap artikel ini akan membantu semua orang dalam pengaturcaraan jQuery.