JQuery tabs - all content loads first, then hides

[rhorne]

So I'm trying to implement the basic JQuery tabs example from the JQuery website.

If I paste the vanilla code onto a page by itself it works just fine.

However, whenever I try and integrate the code into my site - using the exact same code - I encounter a problem where each and every tab's contents loads in the page first - unstyled - and then when the page is fully loaded, they all hide. Obviously this is not how I want it to work.

Can anyone see what's going wrong?

[allaboutthegames.co.uk ]

[Fotiman]

Welcome to WebmasterWorld!
Looks like you have some ads that are holding up your document. An alternative might be to do something like this instead:

<div id="tabs"> 
  <ul> 
    <li><a href="#fragment-1"><span>One</span></a></li> 
    <li><a href="#fragment-2"><span>Two</span></a></li> 
    <li><a href="#fragment-3"><span>Three</span></a></li> 
  </ul> 
  <div id="fragment-1"> 
    <p>First tab is active by default:</p> 
    <pre><code>$('#example').tabs();</code></pre> 
  </div> 
  <div id="fragment-2"> 
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
  </div> 
  <div id="fragment-3"> 
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
  </div> 
</div><br />
<script> 
$("#tabs").tabs();
</script> 

This way, rather than waiting for the document to be ready, you're initializing the tabs immediately as soon as #tabs is ready.

Hope that helps.