Estoy usando la barra de navegación de arranque y tengo una barra de navegación plegable. Pero me enfrento a un problema extraño, cada vez que abro mi sitio, es decir, teléfono móvil o tableta (en realidad, para qué dispositivos necesito la barra de navegación plegable), aparece el botón pero no puedo abrir la barra de navegación. Esto no debería suceder. Si hago clic en el botón de la barra de navegación (botón de tres líneas), no sucede nada.
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#collapsable-nav" aria-expanded="false"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <div id="collapsable-nav" class="collapse navbar-collapse"> <ul id="nav-list" class="nav navbar-nav navbar-right"> <li> <a href="menu-categories.html"> <span class="glyphicon glyphicon-cutlery"></span> <br class="hidden-xs">Menu </a> </li> <li> <a href="#"> <span class="glyphicon glyphicon-info-sign"></span> <br class="hidden-xs">About </a> </li> <li> <a href="#"> <span class="glyphicon glyphicon-certificate"></span> <br class="hidden-xs">Awards </a> </li> <li id="phone" class="hidden-xs"> <a href="tel:410-602-5008"> <span>410-602-5008</span> </a> <div>* We Deliver</div> </li> </ul> </div>Verifique su versión de jQuery. Espero que esto solucione tu problema. Aquí hay un enlace de demostración: https://codepen.io/shamimipt/pen/abLKRrx
<html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> <title>Bootstrap 101 Template</title> <!-- Bootstrap --> <link href="css/bootstrap.min.css" rel="stylesheet"> <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script> <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> <![endif]--> </head> <body> <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <!-- Include all compiled plugins (below), or include individual files as needed --> <script src="js/bootstrap.min.js"></script> </body> </html>```