【轉載】jQuery動畫連續觸發、滯後反覆執行解決辦法

轉載: http://www.cnblogs.com/yuejin/archive/2012/12/18/2822595.html

jQuery中slideUp 、slideDown、animate等動畫運用時，若是目標元素是被外部事件驅動, 當鼠標快速地連續觸發外部元素事件, 動畫會滯後的反覆執行，其表現不雅。

則解決辦法：

一、在觸發元素上的事件設置爲延遲處理, 便可避免滯後反覆執行的問題（使用setTimeout）

二、在觸發元素的事件時預先中止全部的動畫，再執行相應的動畫事件（使用stop）

jquery stop：

//語法結構
$("#div").stop();//中止當前動畫，繼續下一個動畫
$("#div").stop(true);//清除元素的全部動畫
$("#div").stop(false, true);//讓當前動畫直接到達末狀態 ，繼續下一個動畫
$("#div").stop(true, true);//清除元素的全部動畫，讓當前動畫直接到達末狀態
本人通常推薦使用第二種方法　

$("#div").stop().animate({width:"100px"},100);