-2

I'm using BootStrap's Tabs ( http://getbootstrap.com/javascript/#tabs ). Is there a way to get it so that when you got to example.com/#8 it brings you to the tab marked 8?

Current code: 

<!-- Nav tabs -->
<ul class="nav nav-tabs" id="MyTabs">
  <li><a href="#8" data-toggle="tab">8</a></li>
  <li><a href="#7" data-toggle="tab">7</a></li>
  <li><a href="#6" data-toggle="tab">6</a></li>
  <li><a href="#5" data-toggle="tab">5</a></li>
  <li><a href="#4" data-toggle="tab">4</a></li>
</ul>
<!-- Tab panes -->
<div class="tab-content">
...
</div>

I don't normally use JS because I have not learned it yet but any help would be awesome!

David Mulder
  • 26,123
  • 9
  • 51
  • 114
fredghostkyle
  • 3
  • 6

1 Answers1

0
// Javascript to enable link to tab
var url = document.location.toString();
if (url.match('#')) {
    $('.nav-tabs a[href=#'+url.split('#')[1]+']').tab('show') ;
} 

// Change hash for page-reload
$('.nav-tabs a').on('shown', function (e) {
    window.location.hash = e.target.hash;
})

From: The Same Question on SO but I would suggest attempting your own research in the future. An example search I would use to find an answer would be something like this

Community
  • 1
  • 1
Mini John
  • 7,855
  • 9
  • 59
  • 108