// Caroussel 


$(document).ready(function() { 
 
    // Calcul pralables : 
         
        // Element de rfrence pour la zone de visualisation (ici le premier item) 
        Reference = $(".carrousel li:first-child"); 
         
        // Nombre d'lments de la liste 
        NbElement = $(".carrousel li").length; 
     
    // Ciblage de la bande de diapositives 
    $(".carrousel") 
        // Englobage de la liste par la zone de visualisation 
        .wrap('<div class="carrousel-conteneur"></div>') 
        // Application d'une largeur  la bande de diapositive afin de conserver une structrure horizontale 
        .css("width", (Reference.width() * NbElement) ); 
     
    // Ciblage de la zone de visualisation 
    $(".carrousel-conteneur") 
        // Application de la largeur d'une seule diapositive 
        .width(  Reference.width()  ) 
        // Application de la hauteur d'une seule diapositive 
        .height( Reference.height() ) 
        // Blocage des dbordements 
        .css("overflow", "hidden"); 
        
        
     // Ciblage de la zone de visualisation 
    $(".carrousel-conteneur") 
        // Application de la largeur d'une seule diapositive 
        .width(  Reference.width()  ) 
        // Application de la hauteur d'une seule diapositive 
        .height( Reference.height() ) 
        // Blocage des dbordements 
        .css("overflow", "hidden") 
        // Insertion des boutons de navigation 
        .before('' 
            +    '    <div style="float:left; margin-top : 60px;" class="carrousel-prev"><a href="#"><img src="images/precedent.png"  width="40" height="40"></a></div>' 
            +    '')  
        
        
        .after('' 
            +    '    <div style="float:right; position: relative; bottom : 100px;" class="carrousel-next"><a href="#"><img src="images/suivant.png"  width="40" height="40"></a>'
            +    ' </div><span style="clear both;"> </span> ' 
            +    '');  
            
            
        
        
        
        
        // Initialisation du compteur 
        Cpt = 0; 
     
        // Clic sur le lien "Suivant" 
        $(".carrousel-next a").click(function() { 
     
            // Si le compteur est infrieur au nombre de diaposives moins 1  
            if(Cpt < (NbElement-1) ) { 
             
                // Ajout +1 au compteur (nous allons sur la diapositive suivante) 
                Cpt++; 
                 
                // Mouvement du carrousel en arrire-plan 
                $(".carrousel").animate({ 
                    marginLeft : - (Reference.width() * Cpt) 
                }); 
                 
            } // fin du if 
                 
            // Blocage du lien 
            return false; 
             
        }); 
         
        // Action du lien "Prcdent" 
        $(".carrousel-prev a").click(function() { 
         
            // Si le compteur est suprieur  zro 
            if(Cpt > 0) { 
             
                // Soustraction -1 au compteur (nous allons sur la diapositive prcdente) 
                Cpt--; 
             
                // Mouvement du carrousel en arrire-plan 
                $(".carrousel").animate({ 
                    marginLeft : - (Reference.width() * Cpt) 
                }); 
                 
            } // fin du if 
 
             
            // Blocage du lien 
            return false; 
         
        }); 
     
});


// Caroussel1 
$(document).ready(function() { 
 
    // Calcul pralables : 
         
        // Element de rfrence pour la zone de visualisation (ici le premier item) 
        Reference = $(".carrousel1 li:first-child"); 
         
        // Nombre d'lments de la liste 
        NbElement = $(".carrousel1 li").length; 
     
    // Ciblage de la bande de diapositives 
    $(".carrousel1") 
        // Englobage de la liste par la zone de visualisation 
        .wrap('<div class="carrousel1-conteneur"></div>') 
        // Application d'une largeur  la bande de diapositive afin de conserver une structrure horizontale 
        .css("width", (Reference.width() * NbElement) ); 
     
    // Ciblage de la zone de visualisation 
    $(".carrousel1-conteneur") 
        // Application de la largeur d'une seule diapositive 
        .width(  Reference.width()  ) 
        // Application de la hauteur d'une seule diapositive 
        .height( Reference.height() ) 
        // Blocage des dbordements 
        .css("overflow", "hidden"); 
        
        
     // Ciblage de la zone de visualisation 
    $(".carrousel1-conteneur") 
        // Application de la largeur d'une seule diapositive 
        .width(  Reference.width()  ) 
        // Application de la hauteur d'une seule diapositive 
        .height( Reference.height() ) 
        // Blocage des dbordements 
        .css("overflow", "hidden") 
        // Insertion des boutons de navigation 
        .before('' 
            +    '    <div style="float:left; margin-top : 60px;" class="carrousel1-prev"><a href="#"><img src="images/precedent.png"  width="40" height="40"></a></div>' 
            +    '')  
        
        
        .after('' 
            +    '    <div style="float:right; position: relative; bottom : 100px;" class="carrousel1-next"><a href="#"><img src="images/suivant.png"  width="40" height="40"></a>'
            +    ' </div><span style="clear both;"> </span> ' 
            +    '');  
            
            
        
        
        
        
        // Initialisation du compteur 
        Cpt = 0; 
     
        // Clic sur le lien "Suivant" 
        $(".carrousel1-next a").click(function() { 
     
            // Si le compteur est infrieur au nombre de diaposives moins 1  
            if(Cpt < (NbElement-1) ) { 
             
                // Ajout +1 au compteur (nous allons sur la diapositive suivante) 
                Cpt++; 
                 
                // Mouvement du carrousel1 en arrire-plan 
                $(".carrousel1").animate({ 
                    marginLeft : - (Reference.width() * Cpt) 
                }); 
                 
            } // fin du if 
                 
            // Blocage du lien 
            return false; 
             
        }); 
         
        // Action du lien "Prcdent" 
        $(".carrousel1-prev a").click(function() { 
         
            // Si le compteur est suprieur  zro 
            if(Cpt > 0) { 
             
                // Soustraction -1 au compteur (nous allons sur la diapositive prcdente) 
                Cpt--; 
             
                // Mouvement du carrousel1 en arrire-plan 
                $(".carrousel1").animate({ 
                    marginLeft : - (Reference.width() * Cpt) 
                }); 
                 
            } // fin du if 
 
             
            // Blocage du lien 
            return false; 
         
        }); 
     
});


// Caroussel2
$(document).ready(function() { 
 
    // Calcul pralables : 
         
        // Element de rfrence pour la zone de visualisation (ici le premier item) 
        Reference = $(".carrousel2 li:first-child"); 
         
        // Nombre d'lments de la liste 
        NbElement = $(".carrousel2 li").length; 
     
    // Ciblage de la bande de diapositives 
    $(".carrousel2") 
        // Englobage de la liste par la zone de visualisation 
        .wrap('<div class="carrousel2-conteneur"></div>') 
        // Application d'une largeur  la bande de diapositive afin de conserver une structrure horizontale 
        .css("width", (Reference.width() * NbElement) ); 
     
    // Ciblage de la zone de visualisation 
    $(".carrousel2-conteneur") 
        // Application de la largeur d'une seule diapositive 
        .width(  Reference.width()  ) 
        // Application de la hauteur d'une seule diapositive 
        .height( Reference.height() ) 
        // Blocage des dbordements 
        .css("overflow", "hidden"); 
        
        
     // Ciblage de la zone de visualisation 
    $(".carrousel2-conteneur") 
        // Application de la largeur d'une seule diapositive 
        .width(  Reference.width()  ) 
        // Application de la hauteur d'une seule diapositive 
        .height( Reference.height() ) 
        // Blocage des dbordements 
        .css("overflow", "hidden") 
        // Insertion des boutons de navigation 
        .before('' 
            +    '    <div style="float:left; margin-top : 60px;" class="carrousel2-prev"><a href="#"><img src="images/precedent.png"  width="40" height="40"></a></div>' 
            +    '')  
        
        
        .after('' 
            +    '    <div style="float:right; position: relative; bottom : 100px;" class="carrousel2-next"><a href="#"><img src="images/suivant.png"  width="40" height="40"></a>'
            +    ' </div><span style="clear both;"> </span> ' 
            +    '');  
            
            
        
        
        
        
        // Initialisation du compteur 
        Cpt = 0; 
     
        // Clic sur le lien "Suivant" 
        $(".carrousel2-next a").click(function() { 
     
            // Si le compteur est infrieur au nombre de diaposives moins 1  
            if(Cpt < (NbElement-1) ) { 
             
                // Ajout +1 au compteur (nous allons sur la diapositive suivante) 
                Cpt++; 
                 
                // Mouvement du carrousel2 en arrire-plan 
                $(".carrousel2").animate({ 
                    marginLeft : - (Reference.width() * Cpt) 
                }); 
                 
            } // fin du if 
                 
            // Blocage du lien 
            return false; 
             
        }); 
         
        // Action du lien "Prcdent" 
        $(".carrousel2-prev a").click(function() { 
         
            // Si le compteur est suprieur  zro 
            if(Cpt > 0) { 
             
                // Soustraction -1 au compteur (nous allons sur la diapositive prcdente) 
                Cpt--; 
             
                // Mouvement du carrousel2 en arrire-plan 
                $(".carrousel2").animate({ 
                    marginLeft : - (Reference.width() * Cpt) 
                }); 
                 
            } // fin du if 
 
             
            // Blocage du lien 
            return false; 
         
        }); 
     
});


//carousel3

$(document).ready(function() { 
 
    // Calcul pralables : 
         
        // Element de rfrence pour la zone de visualisation (ici le premier item) 
        Reference = $(".carrousel3 li:first-child"); 
         
        // Nombre d'lments de la liste 
        NbElement = $(".carrousel3 li").length; 
     
    // Ciblage de la bande de diapositives 
    $(".carrousel3") 
        // Englobage de la liste par la zone de visualisation 
        .wrap('<div class="carrousel3-conteneur"></div>') 
        // Application d'une largeur  la bande de diapositive afin de conserver une structrure horizontale 
        .css("width", (Reference.width() * NbElement) ); 
     
    // Ciblage de la zone de visualisation 
    $(".carrousel3-conteneur") 
        // Application de la largeur d'une seule diapositive 
        .width(  Reference.width()  ) 
        // Application de la hauteur d'une seule diapositive 
        .height( Reference.height() ) 
        // Blocage des dbordements 
        .css("overflow", "hidden"); 
        
        
     // Ciblage de la zone de visualisation 
    $(".carrousel3-conteneur") 
        // Application de la largeur d'une seule diapositive 
        .width(  Reference.width()  ) 
        // Application de la hauteur d'une seule diapositive 
        .height( Reference.height() ) 
        // Blocage des dbordements 
        .css("overflow", "hidden") 
        // Insertion des boutons de navigation 
        .before('' 
            +    '    <div style="float:left; margin-top : 60px;" class="carrousel3-prev"><a href="#"><img src="images/precedent.png"  width="40" height="40"></a></div>' 
            +    '')  
        
        
        .after('' 
            +    '    <div style="float:right; position: relative; bottom : 100px;" class="carrousel3-next"><a href="#"><img src="images/suivant.png"  width="40" height="40"></a>'
            +    ' </div><span style="clear both;"> </span> ' 
            +    '');  
            
            
        
        
        
        
        // Initialisation du compteur 
        Cpt = 0; 
     
        // Clic sur le lien "Suivant" 
        $(".carrousel3-next a").click(function() { 
     
            // Si le compteur est infrieur au nombre de diaposives moins 1  
            if(Cpt < (NbElement-1) ) { 
             
                // Ajout +1 au compteur (nous allons sur la diapositive suivante) 
                Cpt++; 
                 
                // Mouvement du carrousel3 en arrire-plan 
                $(".carrousel3").animate({ 
                    marginLeft : - (Reference.width() * Cpt) 
                }); 
                 
            } // fin du if 
                 
            // Blocage du lien 
            return false; 
             
        }); 
         
        // Action du lien "Prcdent" 
        $(".carrousel3-prev a").click(function() { 
         
            // Si le compteur est suprieur  zro 
            if(Cpt > 0) { 
             
                // Soustraction -1 au compteur (nous allons sur la diapositive prcdente) 
                Cpt--; 
             
                // Mouvement du carrousel3 en arrire-plan 
                $(".carrousel3").animate({ 
                    marginLeft : - (Reference.width() * Cpt) 
                }); 
                 
            } // fin du if 
 
             
            // Blocage du lien 
            return false; 
         
        }); 
     
});