간단한 jquery 클릭 이벤트 스크립트, 그 루프

Question

나는 간단한 jQuery 스크립트를 가지고있다. 이 스크립트는 다음과 같습니다.

var menu = $('#nav .menu'); 

$('li', menu).mouseenter(function() { 
    $(this).find('.sub-menu').slideDown(); 
}).mouseleave(function(){ 
    $(this).find('.sub-menu').slideUp(); 
}); 

이 스크립트는 하위 메뉴를 엽니 다. 하지만이 스크립트에 문제가 있습니다. 빨리 넘어 가면. 스크립트가 매번 시작됩니다. 아이템을 빠르게 지나칠 때. 메뉴가 많이 열립니다. 이 문제를 어떻게 해결할 수 있습니까? 도움

Answer 1

사용 jQuery의 .stop() 기능

는

감사합니다. 필요한 인수를 전달 ex. .stop(true,true),

$('li', menu).mouseenter(function() { 
    $(this).find('.sub-menu').stop().slideDown(); 
}).mouseleave(function(){ 
    $(this).find('.sub-menu').stop().slideUp(); 
}); 

또는 문맥으로이 전달하는 것은 나에게 약간의 깔끔한 보인다 .stop(true) - 그것은 .find()

$('li', menu).mouseenter(function() { 
    $('.sub-menu',this).stop().slideDown(); 
}).mouseleave(function(){ 
    $('.sub-menu',this).stop().slideUp(); 
}); 

Answer 2

사용이 방법으로 같은 일을 :

$('#nav .menu li').hover(function() { 
    $('.submenu').stop().slideDown(); 
}, function(){ 
    $('.submenu').stop().slideUp(); 
});