Question

ok, im using Jquery (edge) version, and bootstrap 2.0, and i have this code:

    <div id="leftcol">
    <div id="ppl" class="tabbable tabs-left">
        <ul id="tabppl">
        <li class="active"><a class="bl" href="#1" data-target="#1" data-toggle="tab"> 1<span class="arroright"> </span></a> </li>
        <li><a class="bl" href="#2" data-target="#2" data-toggle="tab"> 2<span class="arroright"> </span></a> </li>
        <li><a class="bl" href="#3" data-target="#3" data-toggle="tab"> 3 <span class="arroright"> </span></a> </li>
        <li><a class="bl" href="#4" data-target="#4" data-toggle="tab">  4<span class="arroright"> </span></a>  </li>
        <li><a class="bl" href="#5" data-target="#5" data-toggle="tab"> 5<span class="arroright"> </span></a></li>
        <li><a class="bl" href="#6" data-target="#6" data-toggle="tab"> 6<span class="arroright"> </span></a>  </li>
        <li><a class="bl" href="#7" data-target="#7" data-toggle="tab"> 7 <span class="arroright"> </span></a></li>
        <li><a class="bl" href="#8" data-target="#8" data-toggle="tab"> 8<span class="arroright"> </span></a>  </li>
        <li><a class="bl" href="#9" data-target="#9" data-toggle="tab">9 <span class="arroright"> </span></a> </li>
        </ul>
    </div><!-- ppl-->
</div><!--leftcol-->

I know the theory, and a simple code like this only works if i put “data-toggle=”tab”” in each -a- tag but the #Direction doesnt appear on the navigation bar, it only changes the content, the url http://twitter.github.com/bootstrap/javascript.html#tabs does not explain this, is like a nav, but with the tabs. I need all this information appear on the navigation bar. Like http://Your-url.com/#yourtabclicked

Answer 1

I found something that work. It makes all the URL work with the #ID pointer.
just adding this:

$(function () {
  var activeTab = $('[href=' + location.hash + ']');
  activeTab && activeTab.tab('show');
});

And this other code to appear your Tab opened on the navigation bar when you click it:

$('.nav a').on('shown', function (e) {
  window.location.hash = e.target.hash;
})

most of the code was found in different parts of this website.

NOTE: you need the lastest JQuery (with the actual 1.7.1 works).