animasi berhenti jQuery
kaedah jQuery stop()
kaedah jQuery stop() digunakan untuk menghentikan animasi atau kesan sebelum ia selesai.
Kaedah stop() berfungsi dengan semua fungsi kesan jQuery, termasuk slaid, pudar dan animasi tersuai.
Sintaks:
$(selector).stop(stopAll,goToEnd);
Parameter stopAll pilihan menentukan sama ada baris gilir animasi harus dikosongkan. Lalai adalah palsu, yang hanya menghentikan animasi aktif dan membenarkan mana-mana animasi beratur untuk dilaksanakan ke belakang.
Parameter goToEnd pilihan menentukan sama ada untuk melengkapkan animasi semasa dengan segera. Lalai adalah palsu.
Jadi, secara lalai, stop() akan mengosongkan animasi semasa yang dinyatakan pada elemen yang dipilih.
Contoh berikut menunjukkan kaedah stop() tanpa parameter:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"> </script> <script> $(document).ready(function(){ $("#div1").click(function(){ $("#div2").slideDown(5000); }); $("#stop").click(function(){ $("#div2").stop(); }); }); </script> <style type="text/css"> #div2,#div1 { padding:5px; text-align:center; background-color:#e5eecc; border:solid 1px #c3c3c3; } #div2 { padding:50px; display:none; } </style> </head> <body> <button id="stop">停止滑動(dòng)</button> <div id="div1">點(diǎn)我向下滑動(dòng)面板</div> <div id="div2">我們必須接受失望,因?yàn)樗怯邢薜?,但千萬(wàn)不可失去希望,因?yàn)樗菬o(wú)窮的</div> </body> </html>
Jalankan atur cara untuk mencubanya
jQuery stop( ) animasi (Dengan parameter)
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"> </script> <script> $(document).ready(function(){ $("#start").click(function(){ $("div").animate({left:'100px'},5000); $("div").animate({fontSize:'3em'},5000); }); $("#stop").click(function(){ $("div").stop(); }); $("#stop2").click(function(){ $("div").stop(true); }); $("#stop3").click(function(){ $("div").stop(true,true); }); }); </script> </head> <body> <button id="start">開(kāi)始</button> <button id="stop">停止</button> <button id="stop2">停止所有</button> <button id="stop3">停止動(dòng)畫,但完成動(dòng)作</button> <p>點(diǎn)擊 "開(kāi)始" 按鈕開(kāi)始動(dòng)畫。</p> <p>點(diǎn)擊 "停止" 按鈕停止當(dāng)前激活的動(dòng)畫,但之后我們能再動(dòng)畫隊(duì)列中再次激活。</p> <p>點(diǎn)擊 "停止所有" 按鈕停止當(dāng)前動(dòng)畫,并清除動(dòng)畫隊(duì)列,所以元素的所有動(dòng)畫都會(huì)停止。</p> <p>點(diǎn)擊 "停止動(dòng)畫,但完成動(dòng)作" 快速完成動(dòng)作,并停止它。</p> <div style="background:#98bf21;height:100px;width:200px;position:absolute;">HELLO</div> </body> </html>
Jalankan program dan cuba