您好,登錄后才能下訂單哦!
這篇文章將為大家詳細講解有關jQuery中終止動畫的方法,小編覺得挺實用的,因此分享給大家做個參考,希望大家閱讀完這篇文章后可以有所收獲。
可以直接使用stop()函數來立即停止當前正在進行的動畫,這樣做的目的在于防止前一個動畫影響后面動畫的效果
在jQuery中可以通過stop()方法來終止動畫。它一般用于兩個動畫間的切換。因為有時鼠標滑動的過快會導致動畫效果與鼠標的動作不一致,這時就需要stop()來停止動畫。接下來在文章中將通過具體實例告訴大家如何使用stop方法
stop() 方法適用于所有 jQuery 效果函數,包括滑動、淡入淡出和自定義動畫等
它有兩個參數為 stopAll、 goToEnd
stopAll表示是否應該清除動畫隊列。默認是 false,即僅停止活動的動畫,允許任何排入隊列的動畫向后執行
goToEnd 表示是否立即完成當前動畫。默認是 false。
因此,默認地,stop() 會清除在被選元素上指定的當前動畫
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"> </script> <script> $(document).ready(function(){ $("#flip").click(function(){ $("#panel").slideDown(5000); }); $("#stop").click(function(){ $("#panel").stop(); }); }); </script> <style type="text/css"> #stop{ margin-bottom:10px; } #panel,#flip { width:200px; padding:5px; text-align:center; background-color:pink; border:solid 1px #ccc; } #panel { display:none; } </style> </head> <body> <button id="stop">停止滑動</button> <div id="flip">點擊向下滑動</div> <div id="panel">停止動畫</div> </body> </html>
效果圖:
關于jQuery中終止動畫的方法就分享到這里了,希望以上內容可以對大家有一定的幫助,可以學到更多知識。如果覺得文章不錯,可以把它分享出去讓更多的人看到。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。