Bootstrap Navbar nicht öffnen oder kollabieren

Ich bin auf der Suche nach einer zusammenklappbaren Navbar. Ich habe es mit dem folgenden Code ohne Erfolg versucht.Bootstrap Navbar nicht öffnen oder kollabieren

Nachstehend ist mein Code:

<!DOCTYPE html> 
<html> 
<head> 
<title> Portfolio</title> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js">  </script> 
</head> 
<body> 
<!-- nav bar --> 
<nav style="background-color:#ffaa00" class="navbar navbar-light navbar-static-top"> 
<div class="container"> 
<div class="navbar-header"> 
<a href="#" class="navbar-brand">Portfolio Site</a> 
<button type="button" class="navbar-toggle" data-  toggle="collapse" data-target=".navigation"><span class="glyphicon glyphicon-     menu-hamburger"></span></button> 
</div> 
<div class="collapse navbar-collapse navigation"> 
<ul class="nav navbar-nav navbar-right" > 
<li><a href="#">Home</a></li> 
<li><a href="#">About</a></li> 
<li><a href="#">Contact</a></li> 
</ul> 
</div> 
</div> 
</nav> 
</body>  
</html>

Quelle

2016-12-15 William Cross

Sie müssen hinzufügen platzieren _ [jQuery] (https://getbootstrap.com/getting-started/#whats-included) _ vor Bootstrap.js und (vielleicht ein Tippfehler) aber 'data-toggle =" collapse "muss' data-toggle = "collapse" 'sein, kein Abstand. – vanburen

Sie verpasst haben,

<span class="sr-only">Toggle navigation</span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span>

in Ihrem Tag button. Stellen Sie außerdem sicher, dass korrekte Bootstrap und JQuery CDNs

<html> 
 
<head> 
 
<title> Portfolio</title> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
</head> 
 
<body> 
 
<!-- nav bar --> 
 
<nav style="background-color:#ffaa00" class="navbar navbar-light navbar-static-top"> 
 
<div class="container"> 
 
<div class="navbar-header"> 
 
<a href="#" class="navbar-brand">Portfolio Site</a> 
 
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navigation"><span class="glyphicon glyphicon-menu-hamburger"></span></button> 
 
     <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 class="collapse navbar-collapse navigation"> 
 
<ul class="nav navbar-nav navbar-right" > 
 
<li><a href="#">Home</a></li> 
 
<li><a href="#">About</a></li> 
 
<li><a href="#">Contact</a></li> 
 
</ul> 
 
</div> 
 
</div> 
 
</nav> 
 
</body>  
 
</html>

Quelle

2016-12-15 01:58:13 AVI

Benötige ich die Icon-Bar-Span-Tags, dass ich die Glyphicon-Version habe? –

Bootstrap Navbar nicht öffnen oder kollabieren

Antwort

Verwandte Themen