I'm using a simple jQuery script for tabs:
The JS:
$(document).ready(function() {
$(".tab-content").hide();
$("ul.tabs li:first").addClass("active").show();
$(".tab-content:first").show();
$("ul.tabs li").click(function() {
$("ul.tabs li").removeClass("active");
$(this).addClass("active");
$(".tab-content").hide();
var activeTab = $(this).find("a").attr("href");
$(activeTab).show();
return false;
});
});
The HTML (for the index.html):
<div id="tabs">
<ul class="tabs">
<li><a href="#tabs-voters">Top Voters</a></li>
<li><a href="#tabs-commenters">Top Commenters</a></li>
</ul>
<div id="tabs-voters" class="tab-content">
<p id="h1-01">Tab content</p>
<p>Some content</p>
</div>
<div id="tabs-commenters" class="tab-content">
<h2 id="h-02">Tab content</h2>
<p>Some content</p>
<h2 id="h-03">Tab content</h2>
<p>Some content</p>
</div>
</div>
What I need to do is to create a working link to index.html#h-02, index.html#h-03 etc., but these simple links don't work because the tab is hidden by default. Is it possible to modify the JS, so I can link to a bookmark in tabs that are hidden when opening index.html? Can someone point me in the right direction?
Thanks a lot! :)