首先來看一段代碼：
$(document).ready(function() {
$("div.div1").mouseover(function() {
$("div.div2").animate({bottom:'10px'},1000);
})
$("div.div1").mouseout(function() {
$("div.div2").animate({bottom:'-50px'},1000);
})
});上述的代碼很簡單，我之所以沒有用 hover() 來寫，是因爲我想讓代碼思路更清晰，更容易理解！它所實現的效果就是將滑鼠放在class爲“div1”的div上，class爲“div2”的div的bottom值爲“10px”，將滑鼠移開，其值將變爲“-50”px，就是一個class爲div2上下移動的效果，可是當我快速將滑鼠放在class爲div1的div上，然後快速移開，以此反複幾次，然後你會發現那個class爲div2的div在那不停的一上一下，此時，我的滑鼠已經沒動了，這個效果很差，事件延遲觸發，然後我就在想，怎麽解決，剛開始，想到使用omouseenter代替了你原來的mouseover，使得第一次觸發事件後，在對象區域反複移動將不再繼續觸發，然後覺得也可以使用:not(:animated)來判斷當前對象是否正在執行動，還想到了preventDefault();結果都有一一去驗证，去實現，有的出結果了，但效果還是不理想，有的還沒出結果。。。。。
最後，我想到了jQuery的 stop(), 它的作用是停止當前正在運行的動畫，只要將目前正在運行的動畫停下來，然後在實現往上往下移動就好，然後寫下了如下代碼：
$('div.div1').hover(
function() {
$("div.div2").stop().animate({bottom:'10px'},1000);})
},
function() {
$("div.div2").stop().animate({bottom:'-50px'},1000);}
}
);結果解決了jQuery的mouseover和mouseout事件當快速移動 事件延遲觸發問題，而且動畫效果很友好。
mouseover和mouseout在低版本的瀏覽器會出現閃動的現象
滑鼠滑過的時候出現一個層，當滑鼠滑到當前層mouseover和mouseout在低版本的瀏覽器出現閃動現象——解決這個現象的辦法不止一種，最簡單的把mouseover和mouseout換成對應的mouseenter和mouseleave。
當滑鼠指針位於元素上方時，會發生 mouseover 事件。
該事件大多數時候會與 mouseout 事件一起使用。
注釋：與 mouseenter 事件不同，不論滑鼠指針穿過被選元素或其子元素，都會觸發 mouseover 事件。只有在滑鼠指針穿過被選元素時，才會觸發 mouseenter 事件。
注釋：與 mouseleave 事件不同，不論滑鼠指針離開被選元素還是任何子元素，都會觸發 mouseout 事件。只有在滑鼠指針離開被選元素時，才會觸發 mouseleave 事件。請看下面例子的演示。
當滑鼠指針穿過元素時，會發生 mouseenter 事件。該事件大多數時候會與mouseleave 事件一起使用。
注意：mouseover ,mouseout當滑鼠指針穿過被選元素子元素時，也會觸發事件。這在綁定事件時，有時出現意想不到的Bug可能就是由 mouseover mouseout 事件引起的
mouseover與mouseenter
不論滑鼠指針穿過被選元素或其子元素，都會觸發 mouseover 事件。
只有在滑鼠指針穿過被選元素時，才會觸發 mouseenter 事件。
mouseout與mouseleave
不論滑鼠指針離開被選元素還是任何子元素，都會觸發 mouseout 事件。
只有在滑鼠指針離開被選元素時，才會觸發 mouseleave 事件。
