<script> $(function() { $( "#tabs" ).tabs({ ajaxOptions: { error: function( xhr, status, index, anchor ) { $( anchor.hash ).html( "Couldn't load this tab. We'll try to fix this as soon as possible. " + "If this wouldn't be a demo." ); } } }); }); </script> <div class="demo"> <div id="tabs"> <ul> <li><a href="#tabs-1">Preloaded</a></li> <li><a href="ajax/content1.html">Tab 1</a></li> <li><a href="ajax/content2.html">Tab 2</a></li> <li><a href="ajax/content3-slow.php">Tab 3 (slow)</a></li> <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li> </ul> <div id="tabs-1"> <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p> </div> </div> </div><!-- End demo --> tabs-1 displays fine but the other tabs are blank. I tried creating a content1.html and

 put it in the root, then in a folder called ajax etc but no joy. I'd appreciate any help as I'm clearly not getting it at the moment. I'm doing all this locally if on my PC and haven't uploaded anywhere yet if that makes a difference Got the accordian working fine :-) but this has me beat at the mo. Cheers Andrew