slideDown() & caroufredsel

Bonjour,

Me voici depuis plusieurs heures, bloqué sur un problème que je n'arrive pas à résoudre.

Pour faire simple, j'ai un carrousel réalisé avec caroufredsel dans une div portant la classe ".galerie" ayant la propriété css "display : none". J'effectue un slideDown() sur celle-ci afin de l'afficher au click() sur "afficher !" ... La div.galerie s'affiche correctement, cependant, le carrousel n'apparait pas.

J'ai essayer d'ajouter un css("display : block") lors du slideDown() sur tout les fils de .galerie mais rien n'y fait ...

Vous trouverez à cette adresse une version simplifiée de l'effet que j'essaye de réaliser :

slideDown & Caroufredsel

Le fichier html :

<!doctype html>
<html>
    <head>


        <meta charset="UTF-8">


        <title>Test CarouFredSel</title>


        <style type="text/css">


            * { margin:0; padding:0; }
            .galerie { width:100%; padding:20px 0; background-color:#333; display:none; }
            .carrousel { width:100%; height:400px; margin:20px auto; height:400px; display:block;}
            .carrousel a { width:960px; height:400px; display:block; float:left; }


        </style>


    </head>
    <body>


        <p class="btn">Afficher !</p>


        <div class="galerie">


            <div class="carrousel">


                <div id="carrousel">


                    <a><img src="http://lorempixel.com/960/400/nature/1"></a>
                    <a><img src="http://lorempixel.com/960/400/nature/2"></a>
                    <a><img src="http://lorempixel.com/960/400/nature/3"></a>
                    <a><img src="http://lorempixel.com/960/400/nature/4"></a>
                    <a><img src="http://lorempixel.com/960/400/nature/5"></a>
                    <a><img src="http://lorempixel.com/960/400/nature/6"></a>


                </div>


            </div>


        </div>


    </body>


    <script language="javascript" src="jquery.js"></script>
    <script language="javascript" src="caroufredsel.js"></script>
    <script language="javascript">


        $(".btn").click(function() {


            $(".galerie").slideDown();


        });


        $("#carrousel").caroufredsel({
            width: '100%',
            scroll : 1
        });


    </script>


</html>

Merci d'avance pour vos réponses.