[DEBUG]jquery drop down menu hover後快速閃動

http://www.queness.com/resources/html/dropdownmenu/index.html

做DROP DOWN MENU 時, 用左JQUERY的 SLIDEUP同 SLIDEDOWN 來用作ANIMATION , 好似以上網址中的DEMO 咁

$('#nav li').hover(
function () {
//show its submenu
$('ul', this).slideDown(100);

},
function () {
//hide its submenu
$('ul', this).slideUp(100);
}
);

但發現到一個BUG, 就係當你好快咁mouseenter , 再好快咁mouseleave 個submenu, bug就產生了, 竟然見到個sub menu 不斷咁出現→消失→出現→消失...

最後發覺, 係個animation 問題, 當你移出/移入pointer既時候, slidedown animation 未完成又開始做slideup animation, 就會loop死左

解決方法原來好簡單, 就是在開始ANIMATION前STOP左去先

$('#nav li').hover(
function () {
//show its submenu
$('ul', this).stop(true, true).slideDown(100);

},
function () {
//hide its submenu
$('ul', this).stop(true, true).slideUp(100);
}
);

完成!