Как сделать, чтобы меню автоматически скрывалось в мобильной версии (бустрап)?

Question

[noralesma]

Ребят. Есть меню. Работает полностью. Но в мабильной версии, когда разварачиваешь меню и переходишь по ссылке внутри документа - форма с меню так и продолжает висеть. Чтобы она скрылась нужно еще раз нажать на кнопку.
Делаю на бустрапе.

<!-- Меню -->
    <div class="navbar navbar-inverse navbar-fixed-top" ">
    	<div class="container">
    		<div class="navbar-header">
    			<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
    				<span class="icon-bar"></span>
    				<span class="icon-bar"></span>
    				<span class="icon-bar"></span>
    			</button>
    			
    			<a class="navbar-brand" href="index.php" style="text-shadow: 1px 1px 1px #5EBDE7;"><img src="img/logo.svg" alt="Twitter" style="width: 20px; height: 20px; ">super-cleaning</a>
    			<div class="vspis" style="display: inline-block; margin-left: 15px; ">
    			<ul class="nav navbar-nav " ><li class="dropdown" ><a class="dropdown-toggle" href="#"><i class="glyphicon glyphicon-map-marker" aria-hidden="true" style="margin-right: 5px; color: #5EBDE7;"></i>Москва</a>
    				<ul class="dropdown-menu gorod">
    				
    			<?php
			$stmt = $pdo->prepare('SELECT * FROM `cities` WHERE `id` ORDER BY city_num ASC');
			$stmt->execute();
			while ($row = $stmt->fetch(PDO::FETCH_LAZY))
			{
				echo " 	
    				
			                <li><a  href="."http://".$row['city_short'].".".site_domain."".">".$row['city_full']."</a></li>";
			}
	?>
			                
			                
			                
			            </ul>
    				
    				</li></ul></div>
    				
	
    				
    			
    		</div>
    		<div class="navbar-collapse collapse text-center">
    		<div class="vspis" style="display: inline-block; margin-left: -30px; ">
    		    
    			<ul class="nav navbar-nav ">
    			
    			<li><a href="index.php" class="page-scroll">Главная</a></li>
    				<li class="dropdown" ><a class="dropdown-toggle" href="#">Клининг</a>
    				<ul class="dropdown-menu">
			                <li><a  href="genuborka.php">Генеральная уборка</a></li>
			                <li><a href="remontuborka.php">Уборка после ремонта</a></li>
			                <li><a href="podderzuborka.php">Поддерживаюшая уборка</a></li>
			                <li><a href="moykaokon.php">Мойка окон</a></li>
			                <li><a href="khimchsitka.php">Химчистка</a></li>
			                <li><a href="uborkachp.php">Уборка после ЧП</a></li>
			                <li><a href="cleaneram.php">Вакансии</a></li>
			            </ul>
    				
    				</li>
    				<li><a href="#table" class="page-scroll">Цены</a></li>
    				<li><a href="#text-1col" class="page-scroll">Калькулятор</a></li>
    				<li><a href="#items-3col" class="page-scroll">Акции</a></li>
    				<li><a href="yurlitsam.php">Юридическим лицам</a></li>
    			</ul></div>    		
    			<ul class="nav navbar-nav navbar-right">
    				<li><p class="nn" style="padding: 10px;">
    				
    				
<?php	

$link = mysqli_connect($db_host, $db_user, $db_password, $db_database) 
    or die("Ошибка " . mysqli_error($link)); 
     
$query ="SELECT * FROM telefon ORDER BY id DESC";
 
$result = mysqli_query($link, $query) or die("Ошибка " . mysqli_error($link)); 


if (mysqli_num_rows($result) > 0)
{
 $row = mysqli_fetch_array($result); 
 
 do
 {
	
						 echo '			
    				
    				<a href="tel:'.$row["ssilka"].'">'.$row["telefon"].'</a></p></li>
    				
  								';
}
    while ($row = mysqli_fetch_array($result));
}							
							
 ?> 	  		
    			
    			</ul>
    		</div>
    	</div>
    </div>

Пробовала вот так сделать:

<script>
$(document).on('click', 'a.page-scroll', function(event) {
  var $anchor = $(this);
  $('html, body').stop().animate({
    scrollTop: $($anchor.attr('href')).offset().top - 50
  }, 800, 'easeInOutExpo');
  event.preventDefault();
});
  </script>

  <script>
$('.navbar-nav a').on('click', function() {
  if ($('.navbar-toggle').css('display') != 'none') {
    $(".navbar-toggle").trigger("click");
  }
});
  </script>

Answer 1

[noralesma]

РЕШЕНИЕ:

$(function(){ 
     var navMain = $(".navbar-collapse"); 
     navMain.on("click", "a:not([data-toggle])", null, function () {
         navMain.collapse('hide');
     });
 });

Answer 2

[Руслан Янборисов]

Когда то давно налепил вот такой if:

if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent))

Выдаёт true - если пользователь не с компьютера. Не знаю, насколько это надёжно, но пользуюсь этим давно и не разу не подводило.