Div의 메뉴를 사용하는 간단한 jQuery 드롭 다운 메뉴

Question

div의 메뉴를 사용하여 간단한 메뉴 드롭 다운 &을 만들려고합니다. mouseenter에 나는 div와 mouseout에 페이드 아웃하고있다. fadeOut. 그렇지 않으면 나는에 밖으로 가져가없이 페이드 아웃하는 fadedIn 사업부를 만들기 위해을 시도하고,이 열려,

는 사업부가에서 퇴색하는 경우 당신은 그것을 가져가.

다음

.mouseout(function(){ 
      if ($(".test").mouseover){ 
       return false; 
      }else{$('.drop1').fadeOut("fast");} 
     }); 

는 내가 함께 일하고 있어요 바이올린입니다 : : 또한 http://jsfiddle.net/FXYhJ/

,이 할 수있는 더 나은 방법이있다 이 내가 현재 가지고 무엇인가? 이것은 내가 상상할 수있는 가장 간단한 방법입니다. 나중에 나는 코드를 줄이기 위해 변수를 사용할 것이다.

고마워요.

Answer 1

다음은 편집 된 바이올린입니다. http://fiddle.jshell.net/hG2Lu/19/

몇 가지 코멘트 : 대신 mousenter 당신 li를 사용하는 나는 내부의 a 태그로 이동했다. 중첩 된 요소로 작업 할 때 중첩 된 요소 위로 마우스를 가져 가면 부모 요소에 마우스가 올려 져있는 것으로 간주되지 않습니다. 기본적으로 내가 한 것은 코드에 타이머를 도입 한 것입니다. 누군가 nav 옵션을 벗어나면 하위 메뉴가 사라지기 전에 1 초 기다립니다. (당신은 setTimout의 마지막 인자를 변경하여이 지연을 변경할 수 있습니다. 1000 또는 1 초로 설정합니다.) nav와 submenu 사이에 간격이 있기 때문에 이것은 필요합니다. 그래서 사용자에게 마우스를 줄 시간이 필요합니다 마우스를 하위 메뉴로 이동하십시오.

물론 더 나은 jquery 선택기를 사용하여이 코드를 향상시킬 수 있습니다.하지만 이미이 문제가 해결되지 않았습니까? (메뉴의 모든 옵션에 대해 해당 코드 블록을 반복하지 않아도됩니다.)