Trido
Trido

Reputation: 545

Navbar collapse navigation not functioning

I am hoping someone can help me figure out why the collapse in my Bootstrap navbar isn't working. From what I have seen from the Bootstrap examples, it should work. When I view the page on a mobile device or just shrink the window, the nav links collapse as they should, but the button to expand it does not show up.

<nav class="navbar">
    <div class="container">
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-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 href="#" class="pull-left"><img src="/images/logo.png"></a> </div>
    <div class="navbar-collapse collapse">
        <div class="navbar-right"><a href="/contact">CONTACT</a></div>
        <div class="navbar-right"><a href="/about">ABOUT</a></div>
        <div class="navbar-right"><a href="/ourteam">OUR TEAM</a></div>
        <div class="navbar-right"><a href="/work">WORK</a></div>
        <div class="navbar-right"><a href="/services">SERVICES</a></div>
    </div>
    </div>
</nav>

EDIT

I went through the comments and checked everything. There was an issue with jquery not loading, but I resolved that. Still happening though.

Upvotes: 0

Views: 51

Answers (1)

SM Ahmed
SM Ahmed

Reputation: 128

Your data target in the button is .navbar-ex1-collapse but you have not included that in <div class="navbar-collapse collapse"> Include that and try out.

Upvotes: 1

Related Questions