hi everyone ....

I have a problem using dinamic tabs with ajax (I think it is a concept problem). Here is the test code :

1.- Base page (where tabs are created):

1. ..............................
   <div id="jdesktop">
       <a href="#" onclick="javascript:jQuery('#jdesktoptabs').tabs('add', 'tab1.html', 'Tab 1', 0);">Tab 1</a>
       <a href="#" onclick="javascript:jQuery('#jdesktoptabs').tabs('add', 'tab2.html', 'Tab 2', 0);">Tab 2</a>   
       <div id="jdesktoptabs"><ul></ul></div>
   </div>
   <script type="text/javascript">
   jQuery(document).ready(function(){
       jQuery('#jdesktoptabs').tabs();
   });
   </script>
   ..............................
   
   
   
   
   
   
   
   
   
   
   

On this page a new ajax tab is added on link click.

2.- Code for tab1.html are:

1. <div id="tab1Contents" style="width:200px;border:1px solid #ff0000;">
2.     This is tab 1 content
3.    
4.     <div id="tab1Msg"> </div>
5. </div>
6. <script type="text/javascript">
7. jQuery(document).ready(function(){
8.     jQuery('#tab1Msg').html('width is : ' + jQuery('#tab1Contents').width());   
9. });
10. </script>

2.- Code for tab1.html is:

1. <div id="tab2Contents" style="width:400px;border:1px solid #0000ff;">
       This is tab 2 content
       
       <div id="tab2Msg"> </div>
   </div>
   
   <script type="text/javascript">
   jQuery(document).ready(function(){
       jQuery('#tab2Msg').html('width is : ' + jQuery('#tab2Contents').width());    
   });
   </script>
   
   
   
   
   
   
   
   
   
   

There is a link where you can see this on http://etsei.uvigo.es/pruebas/prueba.html

The problem is:
1.- Create an open any tab => you can see div contents width with the message : " width is : 400 (or whatever the div width is)"
2.- From now on every new tab you add or any existing tab you click shows : " width is : 0 "

So why jQuery can read div width only when first tab is added?

Thanks