Carrousel avec images cliquables [résolu]

Bonjour à toutes et tous,
Je voudrais que chaque image du carrousel soit cliquable et s'ouvre via Zoombox. C'est le cas lors du premier défilement, mais après, seule la dernière image reste cliquable. Sans aucun doute un problème au niveau du script, mais je ne comprend pas lequel.
Quelqu'un a-t-il une idée ?

Le script du carrousel :

/*
    CARROUSEL JS
*/
var carrousel = {
    
    nbSlide : 0,
    nbCurrent : 1,
    elemCurrent : null,
    elem : null,
    timer : null,
    
    init : function(elem){
        this.nbSlide = elem.find(".compo").length;
        
        // pagination
        elem.append('<div class="navigation"></div>');
        for(var i=1;i<=this.nbSlide;i++){
            elem.find(".navigation").append("<span>"+i+"</span>");
        }
        elem.find(".navigation span").click(function(){ carrousel.gotoSlide($(this).text()); })
        
        // Initialisation du carrousel
        this.elem=elem;
        elem.find(".compo").hide();
        elem.find(".compo:first").show();
        this.elemCurrent = elem.find(".compo:first");
        this.elem.find(".navigation").css("opacity",0.9);   
        this.elem.find(".navigation span:first").addClass("active");
        
        //  timer
        carrousel.play();
        // Stop quand on passe dessus
        elem.mouseover(carrousel.stop);
        elem.mouseout(carrousel.play);
    },
    
    gotoSlide : function(num){
        if(num==this.nbCurrent){ return false; }
          
        //Animation Titre + Fadein/Out sur la div visu

        this.elemCurrent.find(".visu").fadeOut();
        this.elem.find("#slide"+num).show();
        this.elem.find("#slide"+num+" .visu").hide().fadeIn();
        var titleHeight = this.elemCurrent.find(".title").height();
        this.elemCurrent.find(".title").animate({"bottom": -titleHeight},500);
        this.elem.find("#slide"+num+" .title").css("bottom",-titleHeight).animate({"bottom": 0},500);
        //*/
        
        this.elem.find(".navigation span").removeClass("active");
        this.elem.find(".navigation span:eq("+(num-1)+")").addClass("active");
        this.nbCurrent = num;
        this.elemCurrent = this.elem.find("#slide"+num);
    },
    
    next : function(){
        var num  = this.nbCurrent+1;
        if(num  >this.nbSlide){
            num  = 1;
        }
        this.gotoSlide(num);
    },
    prev : function(){
        var num  = this.nbCurrent-1;
        if(num< 1){
            num= this.nbSlide;
        }
        this.gotoSlide(num);
    },
    stop : function(){
        window.clearInterval(carrousel.timer);
    },
    play : function(){
        window.clearInterval(carrousel.timer);
        carrousel.timer = window.setInterval("carrousel.next()",4000);
    }

}

$(function(){
    carrousel.init($("#carrousel"));
}); 

Modifié par groshapas (22 Dec 2010 - 19:11)