Закрытие навигации Tab On Нажмите сейчас

Привет, у меня есть следующий код для создания вкладки навигации, и он закрывается, когда я нажимаю на один из списков там, но нет, если я нажму, я новичок в этом, поэтому любая помощь будет большойЗакрытие навигации Tab On Нажмите сейчас

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, iniitial-scale=1"> 
    <title>Home</title> 

<link rel="stylesheet" type="text/css" href="css/main.css"> 
</head> 
<body> 

<!-- NAVIGATION TAB--> 

<nav> 

    <a href="#" class="nav-togg"></a> 

    <ul> 
    <h1 class="navhead1">HOME</h1> 
     <li><a href="Home.html">Home</a></li> 
     <li><a href="About.html">About</a></li> 
     <li><a href="Products.html">Products</a></li> 
     <li><a href="Contact.html">Contact</a></li> 
    </ul> 


</nav> 

<script  src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
<script type="text/javascript"> 


(function() { 

    var bodyEl = $('body'), 
     navTogg = bodyEl.find('.nav-togg'); 

     navTogg.on('click', function(e){ 
      bodyEl.toggleClass('active-nav'); 
      e.preventDefault(); 

     }); 



})();

Я хочу, чтобы его закрыть, когда я нажимаю прочь в любом месте на странице благодаря

Шак

источник

2017-01-28 Shaq Alom

Это может справиться с чеком щелкнул область:

$(document).ready(function(){ 
 
\t \t 
 
    $(document).on('click',function(e){ 
 
\t if($(e.target).closest('.nav-togg').length) 
 
\t  $('body').toggleClass('active-nav'); 
 
\t else 
 
\t  $('body').removeClass('active-nav'); 
 
    }); 
 
});

nav ul{ 
 
    display: none; 
 
} 
 
.active-nav nav ul{ 
 
    display: block; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 

 
<nav> 
 

 
    <a href="#" class="nav-togg">toggle</a> 
 

 
    <ul> 
 
    <h1 class="navhead1">HOME</h1> 
 
     <li><a href="Home.html">Home</a></li> 
 
     <li><a href="About.html">About</a></li> 
 
     <li><a href="Products.html">Products</a></li> 
 
     <li><a href="Contact.html">Contact</a></li> 
 
    </ul> 
 

 

 
</nav>

источник

2017-01-28 15:51:43 talkhabi

Привет спасибо за быстрый ответ, я не очень хорошо знакомы с этим все так, что мне нужно добавить и где? спасибо shaq - –

@ShaqAlom замените код js кодом. – talkhabi

Закрытие навигации Tab On Нажмите сейчас

ответ

Смежные вопросы