Einklappen der Navigationsleiste

Ich möchte eine kollabierende Navigationsleiste im Bootstrap erstellen. aber mein Code funktioniert nicht :(unter meinem Code. ich kann es nicht herausfinden, wo ich einen Fehler mache ist. Bitte helfen Sie mirEinklappen der Navigationsleiste

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>Bootstrap Website</title> 
    <link rel="stylesheet" type="text/css" href="assets/css/bootstrap.min.css"> 
    <script type="text/javascript" src="assets/js/jquery.min.js"></script> 
    <script type="text/javascript" src="assets/js/bootstrap.min.js"></script> 
</head> 
<body> 
    <nav class="navbar navbar-default"> 
     <div class="container-fluid"> 
      <div class="navbar-header"> 
       <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
       </button> 
       <a class="navbar-brand" href="#">Logo</a> 
      </div> 
      <div class="collapse navbar-collapse" id="myNavbar"> 
       <ul class="nav navbar-nav navbar-right"> 
        <li><a href="#"><span class="glyphicon glyphicon-home"></span> Home</a></li> 
        <li><a href="#"><span class="glyphicon glyphicon-briefcase"></span> About</a></li> 
        <li><a href="#"><span class="glyphicon glyphicon-cog"></span> Services</a></li> 
        <li><a href="#"><span class="glyphicon glyphicon-envelope"></span> Contact</a></li> 
        <li><a href="#"><span class="glyphicon glyphicon-globe"></span> Blog</a></li> 
       </ul> 
     </div> 
     </div> 
    </nav> 
</body> 
</html>

Quelle

2016-08-13 Gunvant Sarpate

Scheint gut zusammenzufallen. [Demo] (http://www.bootply.com/JDdKU26A1j). Klicke auf der rechten Seite auf das Handy-Symbol. –

Ich sehe, dass Sie nicht das sind jQuery auf Ihrem Code, der ist, warum es nicht ist funktioniert. Immer remeber dass jQuery von allen Bootstrap JavaScript-Plugins erforderlich ist, um es Funktion zu machen (lesen sie das Bootstrap docs auch, um zu sehen, welche Versionen von jQuery kompatibel sind).

der richtige Weg jQuery enthalten ist direkt vor der JavaScripts-Datei des Bootstrap (oben) Und damit Ihre Seite schneller geladen wird, platzieren Sie Ihre JavaScripts am Ende des Seiteninhalts, direkt vor dem schließenden Tag

Sie können alle jQuery-Versionen here (nur die Core-Versionen) aufgelistet haben.

Das Snippet

<!-- jQuery must come first --> 
<script src="https://code.jquery.com/jquery.min.js"></script> 
<!-- And below here is the Bootstrap JS file(s) --> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

Ihr Code ist ohne Fehler tatsächlich in Ordnung. Hier ist die demo Ihres Codes.

Quelle

2016-08-15 05:52:12

Einklappen der Navigationsleiste

Antwort

Verwandte Themen