2011-08-16 6 views
3

은 이미 검색과 어떻게 든 일치하는 질문을 찾을 수 없습니다로 마우스를 할 때 영업을한다 사업부 열린 하위 메뉴에서 Mousover .. OO 이제jQuery를 :

, 나는이 div의 "DIV 1"과있어 다른 하나는 숨겨져 있습니다 ("하위 메뉴"). 이제 div 1 위로 마우스를 가져 가면 div 바로 옆에 하위 메뉴가 나타나고 올바른 것입니다. 그러나 마우스를 하위 메뉴로 이동하면 사라집니다. 내가 mouson과로 마우스로에서 분리하면 내가 DIV 1.

에 가져가 트리거를 가지고 때문입니다

,이 메뉴는 때로 마우스를 닫아야합니다 '말을 어떻게 든 가능하지만, 커서가없는 경우에만 하위 메뉴 '?

도움 주셔서 감사합니다.

플로

+0

jsfiddle을 추가 할 수 있습니까? –

+0

이 답변을 참조하십시오 : http://stackoverflow.com/questions/7006504/need-assistance-on-script-jquery/7048105#7048105 –

+0

@Mikey G, 지옥, 당신 말이 맞아요! 이게 내 문제를 해결했습니다! 당신은 답을 쓸 수 있습니다. 나는 정확하게 표시해 줄 수 있습니다. :) –

답변

11

는 비결은 두 가지가 필요합니다

  1. 초기 메뉴 (DIV 1) 두 번째 메뉴 (하위 메뉴)
  2. 합니다 (.mouseleave를 사용) 모두를 감싸는 부모 DIV 방법은() .mouseout하지 - 그리고 # 1

jsFiddle example

012에 언급 된 부모 DIV이 바인딩

mouseout()을 사용하고 싶지 않습니다. 커서가 두 번째 메뉴 위로 이동하자마자 실행됩니다. 왜냐하면 커서가 부모 div를 벗어나는 것을 본질적으로 차단하기 때문입니다. 반면에 mouseleave()는 커서가 부모 div 또는 자식 중 하나를 벗어나지 않은 경우에만 실행됩니다.

+0

글쎄, 그냥 부모 div 이벤트 "hover"를 사용하여 해결했는데, 이것 또한 나에게 잘 작동합니다. meanout, 나는 단지 정확한 이름을 몰랐다. 그러나 나는 당신이 모두 내가 의미했던 것을 이해하기 바랐다. ^^ 감사합니다! –

+0

네, 그게 더 좋은 해결책입니다. .hover()는 mouseover() 및 mouseout()과 반대로 mouseenter() 및 mouseleave()를 사용합니다. 이는 내 대답에서 설명한대로 중요합니다. – maxedison

0

애니메이션을 원하지 않는 경우 : this과 같은 : 호버 선택기를 사용하여 JavaScript없이 처리 할 수 ​​있습니다.