Elastislide carousel cached images

Question

I got some problem with elastislide.js.. When my browser cache is empty (for chrome,firefox and safari), and all of my website is loading, the elastislide is working fine and show my items. However, when I reload the page, the items are cached, they doesn't appears. They are loaded, but max-height and height are set to 0px.

    <div class="main">
    <ul id="carousel" class="elastislide-list">
        <?php $v = 0; ?>
        <?php while($plxShow->plxMotor->plxRecord_arts->loop()): ?>
            <?php $lien = $plxShow->plxMotor->racine; ?>
            <?php $title = $plxShow->plxMotor->plxRecord_arts->result[$v]['title'];
                if(strlen($title) >= 25) {
                    $title = substr($title, 0, 23);
                    $espace = strrpos($title, " ");
                    $title = substr($title, 0, $espace)."...";}?>
            <?php $lien = $lien . 'index.php?article' . $plxShow->plxMotor->plxRecord_arts->result[$v]['numero']; ?>
            <li><a href="<?php printf($lien); ?>"><span class="title_list"><?php echo $title; ?></span><img src="data/images/<?php printf($plxShow->plxMotor->plxRecord_arts->result[$v]['vignette']);?>" alt="image0<?php printf($v); ?>" /></a></li>
            <?php $v += 1; ?>
        <?php endwhile; ?>
    </ul>
</div>

Thanks in advance for the help.

Answer 1

I was doing a bad thing uin my js.

I wasn't using the onReady function of elastislide.

$('#carousel').elastislide({
    onReady:function () {
        $('.elastislide-wrapper').hide();
        $('#elast_close').hide();
        if ($.browser.msie) {
            $('#elast').bind("click", function () {
                $('.elastislide-wrapper').slideDown(500);});
            $('#elast_close').bind("click",function () {
                $('.elastislide-wrapper').slideUp(500);});
        }
        $('#elast').click(function () {
            $('.elastislide-wrapper').slideDown(500);
            $(this).hide();
            $('#elast_close').show();
        });
        $('#elast_close').click(function () {
            $('.elastislide-wrapper').slideUp(500);
            $(this).hide();
            $('#elast').show();
        });
    }
});