Tabs example not working - all tab content shown

Tabs example not working - all tab content shown

Hi there,


just tried the example of jquery.com with tabs.

I've set up jquery tabs with the ui. Included js and css is there aswell as jquery is.

But as soon as I load the page the tabs are properly shown but in every content is the full content of each tab content on top of each other.

The code is exactly the same as shown in the jquery-ui documentation but not working.

Here my includes

  1. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
  2. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.min.js"></script>
  3. <link rel="stylesheet" type="text/css" href="/includes/scripts/jquery/jqueryuicss/base/jquery-ui.css" />

The script

  1. <script>
  2. $(document).ready(function() {
  3.     $(function() {
  4.         $( "#tabs" ).tabs({ active: 0 });
  5.     });
  6. });
  7. </script>

And the HTML

  1. <div id="tabs">
  2. <ul>
  3. <li><a href="#tabs-1"><img src="/images/flaggen/Germany.gif" alt="Deutsch" border="0" /></a></li>
  4. <li><a href="#tabs-2"><img src="/images/flaggen/grossbritanien.gif" alt="Englisch" border="0" /></a></li>
  5. <li><a href="#tabs-3"><img src="/images/flaggen/russland.gif" alt="Russisch" border="0" /></a></li>
  6. </ul>
  7. <div id="tabs-1">
  8.     <p>TEST Deutsch</p>
  9. </div>
  10. <div id="tabs-2">
  11.     <p>TEST Englisch</p>
  12. </div>
  13. <div id="tabs-3">
  14. <p>TEST Russisch</p>
  15. </div>
  16. </div>

Please help, thanks in advance

Bernhard