jq動畫重複執行的解決方法

一,在你的點擊事件中加上一個判斷,假設產生動畫效果目標的是#leftBtn這個節點,那麼你要加上這個判斷
它會確保你的動畫只會在上一個動畫結束後才能產生 ,能夠保持動畫的完整性,可是連續點擊時會有反映遲鈍的感受。函數

if(!$("#leftBtn").is(":animated")){

//執行你的操做

}

二,上一動畫當即結束併到達動畫執行結束時狀態同時來運行下一次動畫
這個會形成動畫脫節不太美觀,可是反應迅速,說到這裏咱們解釋下stop()這個函數的用法。動畫

stop 是jQuery中用於控制頁面動畫效果的方法。運行以後馬上結束當前頁面上的動畫效果。code

stop在新版jQuery中添加了2個參數:事件

第一個參數的意思是是否清空動畫序列,也就是stop的是當前元素的動畫效果仍是中止後面附帶的全部動畫效果,通常爲false,跳過當前動畫效果,執行下一個動畫效果;方法

第二個參數是是否將當前動畫效果執行到最後,意思就是中止當前動畫的時候動畫效果剛剛執行了通常,這個時候想要的是動畫執行以後的效果,那麼這個參數就爲true。不然動畫效果就會停在stop執行的時候im

我的比較喜歡使用stop(true,false);top

$("#leftBtn").stop(true,false).animate({...},1000);
相關文章
相關標籤/搜索