Bootstrap Menu does not work Responsive [closed]

Navigation
-1

Menu with Bootstrap does not work responsively. 

<!DOCTYPE html>
<html>
    <head>
        <title>Nome da Loja</title>
        <meta charset="utf-8" />
        <link rel="stylesheet" href="css/bootstrap.min.css">
        <meta name="viewport" content="width=device-width">
        <script src="js/bootstrap.js"></script>
        <script src='http://code.jquery.com/jquery-2.1.3.min.js'></script>
    </head>

    <body>
       <header>
           <nav class="navbar navbar-inverse">
              <div class="navbar-header">
                  <a href="#" class="navbar-brand">Store</a>
                   <button class="navbar-toggle" type="button" data-target=".navbar-collapse" data-toggle="collapse">Menu</button>
              </div>

               <div class="collapse navbar-collapse">
                   <ul class="nav navbar-nav">
                       <li><a href="#">Novidades</a></li>
                       <li><a href="#">Mais vendidos</a></li>
                   </ul>
               </div>

           </nav>
       </header>
    
asked by anonymous 13.08.2016 / 00:31

2 answers

2

Your Bootstrap.js file is being loaded first than the jquery-2.1.3.min.js file and therefore is not opening the menu.

  • If one js file depends on another, it always needs to be down, and always be careful to put the jQuery files first, since it does not depend on anyone, and always depends on the plugin.
17.09.2016 / 23:30
0

<nav class="navbar navbar-inverse navbar-fixed-top">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#">Project name</a>
        </div>
        <div id="navbar" class="collapse navbar-collapse">
          <ul class="nav navbar-nav">
            <li class="active"><a href="#">Home</a></li>
            <li><a href="#about">About</a></li>
            <li><a href="#contact">Contact</a></li>
          </ul>
        </div><!--/.nav-collapse -->
      </div>
    </nav>
    
13.08.2016 / 00:35
How to submit data from a form without a submit button and without refreshing the page How to access systems from a local server by other machines