How to allow bookmarking of a tab without moving within the page
Assuming the following tabs exist:
<div id="tabs"><ul>
<li><a href="#home"><span>Home</span></a></li>
<li><a href="#first"><span>First Page</span></a></li>
<li><a href="#fsecond"><span>Second Page</span></a></li>
</ul></div>
I would like to make it so when a user selects a tab it changes the
hash to the selected tab (example: clicking on first makes the
location bar read test.html#first ).
I've tried:
$("#tabs > ul").tabs();
$("#tabs > ul").bind("tabsshow", function(event, ui) {
window.location = ui.tab.hash; });
But this leads to the page being moved down to the top of the selected
tab.
I've also tried:
$("#tabs > ul").tabs({
select: function(event, ui){
window.location.hash = ui.tab.hash;
} } );
This leads to the behavior I would like in ff3 but in ie7 it moves it
down the page (the 3rd tab would make it go to the very bottom of the
page or close to it.)
Thanks.