user1023
user1023

Reputation: 39

Dropdown Navbar in Bootstrap not working

When the navbar is resized, the dropdown doesn't seem to work. Is there anything wrong with my codes? Is there any solution for this?

This is my HTML code.

<!-- Fixed navbar -->
<div class="navbar navbar-default navbar-fixed-top" role="navigation">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
        <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="home.php">company</a>
    </div>
    <div class="navbar-collapse collapse">
      <ul class="nav navbar-nav">
        <li class="active"><a href="home.php"><i class="glyphicon glyphicon-home"></i><span>&nbsp;Home</span></a></li>
        <li><a href="order.php"><i class="glyphicon glyphicon-pencil"></i><span>&nbsp;Order</span></a></li>
        <li><a href="cart.php"><i class="glyphicon glyphicon-shopping-cart"></i><span>&nbsp;Cart</span></a></li>
        <li><a href="contactus.php"><i class="glyphicon glyphicon-earphone"></i><span>&nbsp;Contact Us</span></a></li>
        <li><a href="about.php"><i class="glyphicon glyphicon-search"></i><span>&nbsp;About Us</span></a></li>
      </ul>
      <ul class="nav navbar-nav navbar-right">
        <li><a href="register.php"><i class="glyphicon glyphicon-registration-mark"></i><span>&nbsp;Register</span></a></li>
        <li class="active"><a href="login.php"><i class="glyphicon glyphicon-user"></i><span>&nbsp;Login</span></a></li>
      </ul>
    </div><!--/.nav-collapse -->
  </div>
</div>

This is the demo. http://jsfiddle.net/5TATB/

Thanks in advance!

Upvotes: 0

Views: 215

Answers (1)

HTTP
HTTP

Reputation: 1724

According to what I had saw in the console, you did not include jquery framework on jsfiddle and I am sure you did it exactly in your code.

See this

Bootstrap was built with a jquery complement. Before you can use the bootstrap nice javascript plugins you must include jquery before bootstrap.min.js.

See documentation here!

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Working demo here

Upvotes: 1

Related Questions