link directly to tab

[toolman]

Hi,

I have some jQuery tabs. I would like to be able to link to them directly, but I can't work out how to do this.

I have the following code:

 

<div class="container-outer">
  <div class="container">
    <div id="prod-tabs">
      <ul class="tabs">
        <li class="first_tab"><a href="#tab1">Tab 1</a></li>
        <li><a href="#tab2">Tab 2</a></li>
        <li><a href="#tab3">Tab 3</a></li>
      </ul>
    </div>
    <div class="tab_container">
      <div id="tab1" class="tab_content"> tab 1 </div>
      <div id="tab2" class="tab_content"> tab 2 </div>
      <div id="tab3" class="tab_content"> tab 3 </div>
    </div>
  </div>
</div>
</div>

 

 

How could I link directly to each of the tabs?

Thanks!

[kicken]

You'd need to add some javascript that runs onload an inspects the URL hash value to determine which tab to open. For instance (untested):

jQuery(function($){
	var tab = location.hash;
	var $widget = $('#prod-tabs');
	$widget.find('a').each(function(idx,ele){
		if (ele.href == tab){
			$widget.tabs('load', idx);
		}
	});
});