jQuery UI选项卡+ AJAX内容Flash（不是FOUC）

Question

I am using jQuery UI Tabs for the below menu + DIV combination. The first "DIV" (tc0) currently has static content, however, the last 3 have dynamic content (or AJAX) that are loaded from 3 PHP files.

<div id="tabs"><!--Tabs-->

<ul class="grid_12 alpha" id="hmenu"> 
    <li><a href="#tc0">Link 1</a></li>
    <li><a href="example1.php">Link PHP 1</a></li>
    <li><a href="example2.php">Link PHP 2</a></li>
    <li><a href="example3.php">Link PHP 3</a></li>
</ul>

<div class="grid_12 alpha tcon" id="tc0">
    <h2 class="grid_12">Dashboard</h2>
</div>

</div><!--/Close Tabs-->

All the PHP files have the same structure as the div with id="tc0". I've just omitted to list them all. The class "tcon" has regular styling, nothing that affects opacity or display. The grid_12 and alpha are part of the 960.gs.

My jQuery is as follows:

<script type="text/javascript"><!--//TABS-->
    $(document).ready(function(){
        $("#tabs").tabs({ fx: { opacity: 'toggle' } })
    });
</script><!--//END TABS-->

The problem is as follows:

• When clicking from one tab to the other, before the new tab content is shown, the current tab content is flashed and then the opacity is done.

• Before, when all my tabs had "static" content, the opacity worked fine, there was no flash of the tabs content. Now, with the "php" content, there is that flash.

I don't believe this is a FOUC (Flash of Unstyled Content) as my content flashes all styled. The problem is that the current tab / content is reflashed before the transition to the next tab.

If I remove the "fx: opacity" combination, it works fine.

Any ideas are greatly appreciated.