응답 탐색 - 브라우저가

Question

나는이 혀에서 내 자신의 반응 탐색을하고

을 최소화 될 때,/닫기를 열려면 탐색을 얻는 방법 : http://jsfiddle.net/2Pqch/

창이 최소화 : http://www.hongkiat.com/blog/responsive-web-nav/

이 내 바이올린입니다 btn을 열거 나 닫으려면 버튼을 클릭하거나 탐색 바깥을 클릭하여 닫을 수 있어야합니다.

이 기능을 어떻게 추가 할 수 있습니까?

$(function() { 
      var pull  = $('.btn'); 
       menu  = $('nav ul'); 
       menuHeight = menu.height(); 

      $(pull).on('click', function(e) { 
       e.preventDefault(); 
       menu.slideToggle(); 
      }); 

      $(window).resize(function(){ 
       var w = $(window).width(); 
       if(w > 320 && menu.is(':hidden')) { 
        menu.removeAttr('style'); 
       } 
      }); 
     }); 

Answer 1

당신은 같은 것을 할 수 있습니다 : 여기

는 스크립트입니다

http://jsfiddle.net/2Pqch/1/

내가 품어에서 이벤트를 중지 e.stopPropagation();을 추가하고 또한

 $(document).on('click',function(e){ 
      if(!menu.is(":hidden")){ 
       menu.slideToggle(); 
      } 
     }); 

추가

메뉴가 표시되는지 확인합니다. 가려져 있지 않거나 숨겨져 있지 않은 경우 document을 클릭하면 메뉴가 다시 닫힙니다. 이를 수행하는 더 좋은 방법은 document의 아무 곳이나 클릭하면 내용 컨테이너를 닫을 것이기 때문에 콘텐츠 컨테이너를 대상으로 지정하는 것입니다.

Answer 2

탐색을 클릭하거나 창에서 클릭하면 탐색, 탐색을 클릭하면 탐색을 토글합니다.
그렇지 않으면 Nav가 열려 있습니다. & 클릭하면 탐색이 토글됩니다.

      데모http://jsfiddle.net/2Pqch/2/

var clickedOnMenu = false;    

$(pull).on('click', function(e) { 
    e.preventDefault(); 
    clickedOnMenu = true;      
     }); 

    $(window).on('click', function(e) { 

     if(clickedOnMenu) 
     { 
      menu.slideToggle(); 
      clickedOnMenu = false; 
     } 
     else if ((menu).is(":visible")) { 
     menu.slideToggle(); 
     } 
    });