2012-07-14 3 views
0

li 또는 href을 클릭하면 메뉴가 열립니다. 그것은 하나의 ul이고 의 복수는 div에 포함 된 가로 메뉴입니다. ul의 복수로 처리 할 수는 있지만 코드가 너무 무거워서 그렇지 않을 수 있습니다.메뉴가 작동하지 않습니다. jquery

HTML

<ul id="mainmenu" style="width:720px"> 

    <!-- 1Open --> 
      <li id="mainmenudrop"><a href class="drop">helloooo</a> 
      <div style="width:200px height:40px; background:#000000;">hmmmmfyhyf 
</div> 
     </li> 
    <!-- 1 Close --> 
    <!-- 2nd Open --> 
     <li><a href="" class="drop">hello</a> 
      <div style="width100px; height:40px; background:#000000;"> 
       yhythyytyt 
       </div> 
      </div></li> 
    <!-- 2nd Close --> 
</ul> 

jQuery를 : 그것은 필요 이상

$(function() { 
    var toggleMenu = function(e) { 
     var self = $(this), 
      elemType = self[0].tagName.toLowerCase(), 
      //get caller 
      menu = null; 
     if (elemType === 'a') { 
      //anchor clicked, nav back to containing ul 
      menu = self.parents('li').not('li#mainmenudrop'); 
     } else if (elemType === 'li') { 
      //mouseleft ul, ergo menu is this. 
      menu = self; 
     } 
     if (menu) { 
      menu.hide('medium'); 
     } 
     e.preventDefault(); 
     return false; 
    }; 
    $(document).ready(function() { 
     $('href.drop').click(function(e) { 
      $('li#mainmenudrop li').show('medium'); 
      console.log('div clicked'); 
      e.preventDefault(); 
      return false; 
     }); 
     $('li#mainmenudrop a').click(toggleMenu); 
     $('li#mainmenudrop li').mouseleave(toggleMenu); 
    }); 
}); 

답변

0

당신이 많이 힘들어하고 있습니다.

는 또한 마크 업에 문제가 및 JS

href.drop 또한

추가 닫는 DIV a.drop되어 있어야합니다.

그러나 모든 점 외에, 당신이 모두 필요하지 않습니다 이잖아 코드를

http://jsfiddle.net/DTqDD/

참고 JS : 당신은 또한 다시 자바 스크립트 차단과 사용자를위한 가을의 몇 가지 유형을 확인하는 것이 좋습니다.

+0

div가 javan 스크립트가 브라우저에서 사용 중지되면 대신 정상적인 마우스 오버 효과를 대신 사용하여 슬라이드가 열립니다. – david

+0

@topdown 답변 코드를 게시물에 포함하십시오. 이 코드가 없으면 게시물이 쓸모가 없습니다. 그 링크 404, 귀하의 게시물 쓸모가있다. –

관련 문제