title: Make Twitter Bootstrap navbar work like tabs
body: <p>Is there a way to make a navbar (which appears to be designed to link to other pages) behave like a set of nav tabs (which stay on the same page, hiding all but the desired section)?</p>
  
  <p>Actually, my navbar works just as I want, but only if I don't call <code>$(".nav-tabs").button()</code>, which I need for other things.  Now none of the collapsing/uncollapsing happens.</p>
  
  <p>Here's the code (which is pretty boiler-plate):</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div class="navbar navbar-fixed-top"&gt;
   &lt;div class="navbar-inner"&gt;
    &lt;div class="container"&gt;
     &lt;div class="nav-collapse collapse"&gt;
      &lt;ul id="tab" class="nav"&gt;
       &lt;li class="active"&gt;&lt;a href="#Tab1" data-toggle="tab"&gt;Tab1&lt;/a&gt;&lt;/li&gt;
       &lt;li&gt;&lt;a href="#Tab2" data-toggle="tab"&gt;Tab2&lt;/a&gt;&lt;/li&gt;
       &lt;li&gt;&lt;a href="#Tab3" data-toggle="tab"&gt;Tab3&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
      &lt;a class="brand" href="#"&gt;NavTab Demo&lt;/a&gt;
     &lt;/div&gt;
    &lt;/div&gt;
   &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="container-fluid"&gt;
   &lt;div class="row-fluid"&gt;
    &lt;div class="span12"&gt;
     &lt;div class="tab-content"&gt;
      &lt;div class="tab-pane active" id="Tab1"&gt;
  ...
  </code></pre>