[jQuery] jCarousel - mixed items width problem

[syoox]

Hi, I have problem with firstly loading of jcarousel. The UL
#mycarousel width is shorter like width of all items. This problem is
only by first loading. After refresh display jcarousel correctly.

This is HTML:

<ul id="mycarousel" class="jcarousel-skin-tango"> <li><img
src="index_files/tn_s0000.jpg" class="thumbnail" title="zoom"
alt="" /></li>
<li><img src="index_files/tn_41000.jpg" class="thumbnail" title="zoom"
alt="" /></li>
<li><img src="index_files/tn_40-10.jpg" class="thumbnail" title="zoom"
alt="" /></li>
<li><img src="index_files/tn_54000.jpg" class="thumbnail" title="zoom"
alt="" /></li>
<li><img src="index_files/tn_55000.jpg" class="thumbnail" title="zoom"
alt="" /></li>
<li><img src="index_files/tn__dsc1.jpg" class="thumbnail" title="zoom"
alt="" /></li>
<li><img src="index_files/tn__dsc2.jpg" class="thumbnail" title="zoom"
alt="" /></li>
<li><img src="index_files/tn__dsc3.jpg" class="thumbnail" title="zoom"
alt="" /></li>
<li><img src="index_files/tn__dsc4.jpg" class="thumbnail" title="zoom"
alt="" /></li>
<li><img src="index_files/tn_1-200.jpg" class="thumbnail" title="zoom"
alt="" /></li>
<li><img src="index_files/tn_2-200.jpg" class="thumbnail" title="zoom"
alt="" /></li>
<li><img src="index_files/tn_p0000.jpg" class="thumbnail" title="zoom"
alt="" /></li>
<li><img src="index_files/tn_14000.jpg" class="thumbnail" title="zoom"
alt="" /></li>
<li><img src="index_files/tn_5-100.jpg" class="thumbnail" title="zoom"
alt="" /></li>
</ul>

This is javascript:
function initCallbackFunction(carousel)
{
        for (var i = 1; i <= carousel.size(); i++) {
                $("#mycarousel").width(($('ul#mycarousel  .jcarousel-item-' +
i).width()) + $("#mycarousel").width());
        }
};

$(document).ready(function() {
        jQuery('#mycarousel').jcarousel({
                initCallback: initCallbackFunction
            });
});

Have enybody the same problem?
Here is example: http://www.jcarousel.rockstudio.sk/
Thanks
Syoox