Menu
Ok so I'm taking this almost directly off of the docs and nothing seems to be working (I'm actually now ripping their html directly instead of just the example).
First my head section, where the 'template' files are my custom files:
<head>
<title>Hello World</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="/assets/responsive_template/css/bootstrap.css" rel="stylesheet">
<link href="/assets/responsive_template/css/bootstrap-responsive.css" rel="stylesheet">
<link href="/assets/responsive_template/css/template.css" rel="stylesheet">
<script src="/assets/responsive_template/js/jquery.js"></script>
<script src="/assets/responsive_template/js/jquery-ui-1.10.0.min.js"></script>
<script src="/assets/responsive_template/js/bootstrap.js"></script>
<script src="/assets/responsive_template/js/template.js"></script>
</head>
Now the actual navbar section:
<div class="navbar">
<div class="navbar-inner">
<div class="container">
<a href="#" class="btn btn-navbar" data-toggle="collapse" data-target=".navbar-responsive-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="#">Prototype</a>
<div class="nav-collapse collapse navbar-responsive-collapse">
<ul class="nav">
<li><a id="back-button" href="#">Back</a></li>
<li><a id="submit-button" href="#">Submit</a></li>
</ul>
</div>
</div>
</div>
</div>
However running this nothing collapses... it just takes up three whole lines up top on my iPhone. I'm not seeing any errors via chrome console when its below 940px either... any thoughts?
728
Here's the Jsfiddle I created for you - http://jsfiddle.net/shail/F4NfT/10/ Working !
<head>
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/css/bootstrap-combined.min.css" rel="stylesheet">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/js/bootstrap.min.js"></script>
</head>
<div class="navbar">
<div class="navbar-inner">
<div class="container">
<!-- .btn-navbar is used as the toggle for collapsed navbar content -->
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<!-- Be sure to leave the brand out there if you want it shown -->
<a class="brand" href="#">Project name</a>
<!-- Everything you want hidden at 940px or less, place within here -->
<div class="nav-collapse collapse">
<!-- .nav, .navbar-search, .navbar-form, etc -->
</div>
</div>
</div>
</div>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
