My tabbed jquery is loading all the sections then it loads the first tabbed, how to make this stop?

This is what I'm working on: http开发者_如何学C://www.iamjrilla.com/sample.html.

It's taking a while to actually "settle down" if you will. It shows all the content in each tabbed (when page is first loaded) as it would show in dreamweaver & then it finally loads the first tab which is "home". Is there a way I can change this?

All the tabs are initially visible because the tabs don't activate until the document is ready and all your tab divs start off with display: block. When the jQuery tabs activate, the all the tab divs except the first will be hidden with display: none.

Probably the easiest thing to do would be to add style="display: none;" to all the tab divs except the first one. That will show the first panel while the page is loading and keep the others hidden; then, when the page has finished loading and the tabs are activated, the other panels will be available by clicking on their tabs at the top of the page.

Conceptually, load an empty div in the other tabs, then use ajax to fill in the content in those tabs after onload() or jQuery(document).ready().

I think including the class hidetabs on every tabcontent div would solve the purpose. The rest would be handled by jquery tabs js.

<div id='tab3' class="hidetabs">
</div>

.hidetabs
        {
            display: none;
        }