Forum Moderators: open
I've Googled and Googled and Googled and leafed through the jQuery UI 1.6 book, and all examples I've come across put the panels into the same container DIV with the tabs. In the site I'm building they can't be in the same container because of the way the page is laid out.
In some blog comments I saw a reference to this, but the purported page with a solution was gone.
So, simplified, rather than this:
<div id="tabs">
<ul>
<li><a href="#tab-home">Home</a></li>
<li><a href="#tab-pricing">Pricing</a></li>
<li><a href="#tab-about">About Us</a></li>
<li><a href="#tab-contact">Contact Us</a></li>
<li><a href="#tab-privacy">Privacy</a></li>
</ul>
<div id="tab-home">
home
</div>
<div id="tab-pricing">
pricing
</div>
<div id="tab-about">
about
</div>
<div id="tab-contact">
contact
</div>
<div id="tab-privacy">
privacy
</div>
</div>
I'd like to do this:
<div id="tabs">
<ul>
<li><a href="#tab-home">Home</a></li>
<li><a href="#tab-pricing">Pricing</a></li>
<li><a href="#tab-about">About Us</a></li>
<li><a href="#tab-contact">Contact Us</a></li>
<li><a href="#tab-privacy">Privacy</a></li>
</ul>
</div>
<div id="content">
<div id="tab-home">
home
</div>
<div id="tab-pricing">
pricing
</div>
<div id="tab-about">
about
</div>
<div id="tab-contact">
contact
</div>
<div id="tab-privacy">
privacy
</div>
</div>
I'm assuming this is probably (?) pretty simple (once you know it :)). Perhaps someone here can shed light on how I can get it working.
Thanks in advance for any advice!
<head>
...
<script type="text/javascript">
var tab_divs = new Array('tab_home','tab_pricing','tab_about','tab_contact','tab_privacy');function showDiv(id)
{ for (var i=0; i < tab_divs.length; i++) {
var div = document.getElementById(tab_divs[i]);
if (div) {
if (id == tab_divs[i]) div.style.display = 'block'; else div.style.display = 'none';
}}
return true;
}
</script>
</head><body onload="showDiv('tab_home')">
...
<a href="#tab_home" onclick="showDiv('tab_home')">Home</a>
...ditto other links
I haven't tested this, but I think it's roughly what you want.
Kaled.
