div 및 앵커 링크를 묶어 동일한 이벤트에 바인딩했습니다.

Question

메신저가 링크를 포함한 내 전체 탐색 모음에 mouseout()을 바인딩하는 방법을 알아내는 데 어려움이 있습니다.

사용자가 # 하위 메뉴에서 링크를 가리키면 표시됩니다. 모두 거기에 잘있다.

내가 원하는 것은 fadeOut 사용자가 전체 #nav에서 나가면 하위 메뉴입니다. 로 마우스를위한

내 코드 :

$('#nav').mouseout(function() { 
    setTimeout(function() { 
    //$('.sub-link').fadeOut(); 
    }, 2000); 
}); 

내가 #nav에있는 앵커 링크 위로 마우스를 가져 난 하위 메뉴를 참조하십시오. 다음 mouseout() 심지어 화재 및 하위 메뉴 페이드 아웃 것 같아요. #nav와 그 안에 앵커 링크를 하나씩 가지고있는 어쨌든 있나요? ..

난 내 태그를 붙여 싶지만에도 여전히 렌더링 된 HTML로 표시 그것은 4 개 공간 들여 쓰기

에서

샘플 페이지 : http://chrisparaiso.com/test/

Answer 1

mouseleave() 같은 선택기를 사용해보십시오 당신은 무엇을 필요 : 문서에서

$('#nav').mouseleave(function() { 
    setTimeout(function() { 
    $('.sub-link').fadeOut(); 
    }, 2000); 
}); 

:

mouseleave 이벤트는 바인딩 된 요소를 마우스가 떠날 때만 처리기를 트리거합니다. 은 하위 노드이 아닙니다.

커서가 이벤트를 바인딩 한 요소 내부의 요소 위에있는 경우 mouseout이 트리거됩니다. 그러나 mouseleave은 실제로 커서가 while 요소를 벗어날 때만 트리거됩니다.

This example은 mouseleave()과 mouseout() 사이의 차이점을 매우 잘 보여줍니다.

Answer 2

이어야 $('#nav, #nav > a')