2016-02-15 12 views
5

नहीं खोलता है मैं getbootstrap.com से बूटस्ट्रैप संस्करण 3.3.5 का उपयोग कर रहा हूं। मैंने अपनी वेबसाइट (https://getbootstrap.com/components/#navbar) से नेविबार कोड की प्रतिलिपि बनाई। मैंने इस कोड को समायोजित किया ताकि ऐसा लगता है कि मैं इसे कैसे देखना चाहता हूं। इस तरह अभी दिखाई देता है:बूटस्ट्रैप नेविबार हैमबर्गर मेनू

<?php 
/** 
* Created by PhpStorm. 
* User: Olivier 
* Date: 2/10/2016 
* Time: 10:41 AM 
*/ 
?> 
<nav class="navbar navbar-inverse navbar-static-top" role="navigation"> 
    <div class="container"> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle collapsed" data-toggle="dropdown" data-target="#bs-example-navbar-collapse-1"> 
     <span class="sr-only">Toggle navigation</span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </button> 
    </div> 

    <!-- Collect the nav links, forms, and other content for toggling --> 
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
     <ul class="nav navbar-nav"> 
     <li><a href="index.php">Home</a></li> 
     <li><a href="about.php">About</a></li> 
     <li><a href="#portfolio">Portfolio</a></li> 
     <li><a href="#">Blog</a></li> 
     <li><a href="contact.php">Contact</a></li> 
     </ul> 
    </div> 
    </div> 
</nav> 

मैं JQuery और कोड के इस टुकड़े में बूटस्ट्रैप स्टाइलशीट में शामिल हैं: के रूप में मैं कर के रूप में जल्द

<?php 

/** 
* Created by PhpStorm. 
* User: Olivier 
* Date: 2/10/2016 
* Time: 10:30 AM 
*/ 
?> 
<html> 
<head> 
    <title>EquiRent</title> 
    <!-- Latest compiled and minified JavaScript --> 
    <!-- <script src="https://code.jquery.com/jquery-1.12.0.min.js"></script>--> 

    <!-- 
     **Including bootstrap 
     --> 
    <!-- Latest compiled and minified CSS --> 
    <link rel="stylesheet" href="../static/bootstrap/css/bootstrap.min.css"> 
    <!-- Optional theme --> 
    <link rel="stylesheet" href="../static/bootstrap/css/bootstrap-theme.min.css"> 
</head> 
<body> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
<script src="../static/bootstrap/js/bootstrap.min.js"></script> 
</body> 
</html> 

नेवबार बस ठीक लग रहा है और सब कुछ काम करता है लेकिन पेज इतना छोटा है कि हैमबर्गर मेनू स्वचालित रूप से दिखाएगा और मैं इसे क्लिक करता हूं, कुछ भी नहीं होता है।

मैं चाहता हूं कि नौसेना काम करे जैसे कि यह https://getbootstrap.com/components/#navbar पर काम करता है। इसलिए जब मैं खिड़की को छोटा कर देता हूं, तो जब आप इसे क्लिक करते हैं तो हैमबर्गर मेनू वास्तव में कुछ करता है।

उत्तर

6

हाय निम्नलिखित कोड होना चाहिए।

data-toggle="dropdown"

+0

thankyou इतना के बजाय data-toggle="collapse"! –

संबंधित मुद्दे