title: Bootstrap navbar hamburger menu doesnt work
body: <p>I have this code where I try to make a hamburger bootstrap menu with black stripes, and white background. But I don't seem to quite get that done. And next to that my hamburger bootstrap menu does open on mobile format, but doesnt close again. I have surfed internet for solutions, but nothing works. The code: <a href="https://jsfiddle.net/u0fm0trs/" rel="nofollow noreferrer">https://jsfiddle.net/u0fm0trs/</a></p>
  
  <pre><code>&lt;head&gt;
      &lt;title&gt;Makelaardij Jos Bloemendal&lt;/title&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
      &lt;meta charset="UTF-8"&gt;
      &lt;link href="css/bootstrap.min.css" rel="stylesheet"&gt;
      &lt;link rel="stylesheet" href="css/mystyles.css" /&gt;
      &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"&gt;
      &lt;link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css"&gt;
      &lt;link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"&gt;
      &lt;link rel="stylesheet" href="assets/css/Footer-with-map.css"&gt;
      &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"&gt;&lt;/script&gt;
      &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"&gt;&lt;/script&gt;
      &lt;link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet"&gt;
      &lt;script src="/js/bootstrap.min.js"&gt;&lt;/script&gt;
      &lt;link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"/&gt;
      &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
      &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"&gt;&lt;/script&gt;
      &lt;link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"/&gt;
      &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
      &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
      &lt;div class="container-fluid"&gt;
              &lt;nav class="navbar navbar-inverse navbar-static-top" role="navigation" style="background-color: white; border: none;"&gt; 
                  &lt;div class="navbar-header"&gt;
                    &lt;button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"&gt;
                      &lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt;
                      &lt;span class="icon-bar"&gt;&lt;/span&gt;
                      &lt;span class="icon-bar"&gt;&lt;/span&gt;
                      &lt;span class="icon-bar"&gt;&lt;/span&gt;                        
                    &lt;/button&gt;
                  &lt;/div&gt;
              &lt;div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"&gt;
              &lt;div id="navbar"&gt; 
              &lt;ul class="nav navbar-nav navbar-left"&gt;
                      &lt;img src="img/logo checklist 3.jpg"&gt;
                  &lt;/ul&gt;
                  &lt;ul class="nav navbar-nav navbar-right"&gt;
                      &lt;li id="Home"&gt;&lt;a href="index.html"&gt;&lt;p&gt;Home&lt;/p&gt;&lt;/a&gt;&lt;/li&gt;
                              &lt;li id="Woningen" class="dropdown"&gt;
                                &lt;a href="Woningen.html" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"&gt;&lt;p&gt;Woningen&lt;/p&gt;&lt;/a&gt;
                                &lt;ul class="dropdown-menu"&gt;
                                  &lt;li&gt;&lt;a href="Woningen.html"&gt;&lt;p&gt;Alle&lt;/p&gt;&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="Almelo.html"&gt;&lt;p&gt;Almelo&lt;/p&gt;&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="Den Ham OV.html"&gt;&lt;p&gt;Den Ham OV&lt;/p&gt;&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="Enter.html"&gt;&lt;p&gt;Enter&lt;/p&gt;&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="Hardenberg.html"&gt;&lt;p&gt;Hardenberg&lt;/p&gt;&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="Hellendoorn.html"&gt;&lt;p&gt;Hellendoorn&lt;/p&gt;&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="Nijverdal.html"&gt;&lt;p&gt;Nijverdal&lt;/p&gt;&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="Rijssen.html"&gt;&lt;p&gt;Rijssen&lt;/p&gt;&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="Vriezenveen.html"&gt;&lt;p&gt;Vriezenveen&lt;/p&gt;&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="Vroomshoop.html"&gt;&lt;p&gt;Vroomshoop&lt;/p&gt;&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="Wierden.html"&gt;&lt;p&gt;Wierden&lt;/p&gt;&lt;/a&gt;&lt;/li&gt;
                                  &lt;li&gt;&lt;a href="Overige.html"&gt;&lt;p&gt;Overige&lt;/p&gt;&lt;/a&gt;&lt;/li&gt;
                                &lt;/ul&gt;
                              &lt;/li&gt;
                      &lt;li id="Agrarisch"&gt;&lt;a href="Agrarisch.html"&gt;&lt;p&gt;Agrarisch&lt;/p&gt;&lt;/a&gt;&lt;/li&gt;
                      &lt;li id="Bedrijven"&gt;&lt;a href="Bedrijven.html"&gt;&lt;p&gt;Bedrijven&lt;/p&gt;&lt;/a&gt;&lt;/li&gt; 
                      &lt;li id="Recreatie"&gt;&lt;a href="Recreatie.html"&gt;&lt;p&gt;Recreatie&lt;/p&gt;&lt;/a&gt;&lt;/li&gt;
                      &lt;li id="Bosgrond"&gt;&lt;a href="Bosgrond.html"&gt;&lt;p&gt;Bosgrond&lt;/p&gt;&lt;/a&gt;&lt;/li&gt;
                      &lt;li id="Contact"&gt;&lt;a href="#myFooter"&gt;&lt;p&gt;Contact&lt;/p&gt;&lt;/a&gt;&lt;/li&gt;
                  &lt;/ul&gt; 
              &lt;/div&gt;
              &lt;/div&gt;
              &lt;/nav&gt;
  </code></pre>