0

I'm using the Default NavBar of Bootstrap 3.2. The collapse is working when the window is resized down, but the button is not displaying the links when cliked. This is what I have until now:

<body>
<div class="mainHeader">
    <div class="container">
        <nav class="navbar navbar-default" role="navigation">
           <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" 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>
                <a class="navbar-brand" href="#">Bootstrap Test</a>
            </div>

             <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <ul class="nav navbar-nav">
                    <li class="active"><a href="#">Home</a></li>
                    <li><a href="#">enlace1</a></li>
                    <li><a href="#">enlace2</a></li>
                    <li><a href="#">enlace3</a></li>                    
               </ul>           
            </div><!-- /.navbar-collapse -->
         </nav>
    </div>
</div>

<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.min.js"></script>
</body>

Any idea? Thanks in advance.

dan1st
  • 12,568
  • 8
  • 34
  • 67
Sergio
  • 608
  • 12
  • 35

1 Answers1

1

you have to verify your tags you have an additional DIV, i've tried it on bootply.com its working fine

    <body>
      <div class="mainHeader">
<div class="container">
    <nav class="navbar navbar-default" role="navigation">
      <div class="container">
            <button type="button" class="navbar-toggle" data-toggle="collapse" 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>
            <a class="navbar-brand" href="#">Bootstrap Test</a>
      </div>
         <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav">
                <li class="active"><a href="#">Home</a></li>
                <li><a href="#">enlace1</a></li>
                <li><a href="#">enlace2</a></li>
                <li><a href="#">enlace3</a></li>                    
           </ul>           
        </div><!-- /.navbar-collapse -->
     </nav>
</div>
</div>

<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.min.js"></script>
</body>

UPDATE

you have to consider adding <div class="container"> under the nav tag, like the updated code !

UPDATE 2

you have to check the jQuery minimum version required by bootstrap3 check this link

Community
  • 1
  • 1
seddik
  • 639
  • 1
  • 8
  • 20
  • Well, there was a missing DIV :P, but fixed that the button still doesn't works. – Sergio Aug 10 '14 at 09:52
  • I just have signed up. I still can't login. – Sergio Aug 10 '14 at 10:02
  • @sergio i've updated my answer & code !, and you don't have to login to **bootply** to test your code – seddik Aug 10 '14 at 10:02
  • I did test it in bootply and runs as a charm, but still won't run locally. I'll restart... – Sergio Aug 10 '14 at 10:19
  • The exact same code runs in bootply but not here. I did test several browsers. I did test a version placed in the desktop and another places in the localhost. – Sergio Aug 10 '14 at 10:32
  • try uploading the source code (Ctrl + U), and let me see it (on gist or jsfiddle), – seddik Aug 10 '14 at 11:51
  • Please, review it: [jsFiddle](http://jsfiddle.net/sergiourra/1tpf3ohg/) . Many Thanks. – Sergio Aug 10 '14 at 12:44
  • I have tryed changing the link to jquery.min.js (version 1.4.1) to [jquery-latest.min.js](http://code.jquery.com/jquery-latest.min.js") (version 1.11.1) and it worked. Please, write the solution in your answer in order to mark it as the correct one. Many thanks for your help and have a nice day. – Sergio Aug 10 '14 at 13:07