1

I'm using Twitter Bootstrap 3.2 and the button on the right side on the navbar doesn't work when I click on it.

Here's my Code:

<!-- HEADER --> <nav class="navbar navbar-inverse custom" role="navigation"> <div class="container-fluid"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".bs-example-navbar-collapse-1"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="index.html"><img src="images/LynxusLogo.png" /></a> </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 navbar-right"> <li><a href="#"><img src="images/Home.png" onmouseover="hoverHome(this);" onmouseout="unhoverHome(this);"/></a></li> <li><a href="#"><img src="images/About.png" onmouseover="hoverAbout(this);" onmouseout="unhoverAbout(this);"/></a></li> <li><a href="#"><img src="images/Team.png" onmouseover="hoverTeam(this);" onmouseout="unhoverTeam(this);"/></a></li> <li><a href="http://lynxusapp.blogspot.com/" target="_blank"><img src="images/Blog.png" onmouseover="hoverBlog(this);" onmouseout="unhoverBlog(this);"/></a></li> <li><a href="#"><img src="images/Contact.png" onmouseover="hoverContact(this);" onmouseout="unhoverContact(this);"/></a></li> </ul> </div><!-- /.navbar-collapse --> </div><!-- /.container-fluid --> </nav>
Improve this question

1 Answer 1

Reset to default
1

Change the data-target on the button to use the id (#) instead of the class(.) selector

data-target="#bs-example-navbar-collapse-1"

Demo in Fiddle

Improve this answer
Sign up to request clarification or add additional context in comments.

8 Comments

@duhzecca, does it work in the demo I provided? If so, there's something else going on in your code. Make sure you have links to jQuery.js and Bootstrap.js (and in that order).
Even in the demo is not working. I tested right now and it didn't work
On my code I deleted everything else and I just left the navbar inside of the body but it is still not working and I don't know why
The demo should be working. The only reason it's sometimes iffy is because jsFiddle adds a result indicator that sits in the top right of the results pane and often occludes the Bootstrap toggle button. You have to click on the bottom of the button. Alternatively, view the full page result of the demo by adding /show to the url
We have no way to debug what's happening on your local machine. Create a stripped down version and add it to jsFiddle. If it's still broken there, then we can help.
|

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.