jQuery(function($){ 
 
  var settings = { 
    thumbListId: "thumbs", 
    imgViewerId: "viewer", 
    activeClass: "active", 
    activeTitle: "Photo en cours de visualisation", 
    loaderTitle: "Chargement en cours", 
    loaderImage: "Images/loader.gif", 
    bigImageAlt: "Voir l'image suivante",
    viewerBoxId: "viewerBox" 
  }; 
 
  var thumbLinks = $("#"+settings.thumbListId).find("a"), 
      thumbLinksSize = thumbLinks.size(), 
      firstThumbLink = thumbLinks.eq(0), 
      lastThumbLink = thumbLinks.eq(thumbLinksSize-1), 
      loader = $(document.createElement("img")).attr({ 
        alt: settings.loaderTitle, 
        title: settings.loaderTitle, 
        src: settings.loaderImage 
      }), 
      highlight = function(elt){ 
        thumbLinks.removeClass(settings.activeClass).removeAttr("title"); 
        elt.addClass(settings.activeClass).attr("title",settings.activeTitle); 
      }; 
 
  highlight(firstThumbLink); 
 
  $("#"+settings.viewerBoxId).after( 
    $(document.createElement("p")) 
      .attr("id",settings.imgViewerId) 
      .append( 
        $(document.createElement("a")) 
          .attr("href","#") 
          .append( 
            $(document.createElement("img")).attr({ 
              alt: settings.bigImageAlt, 
              src: firstThumbLink.attr("href") 
            }) 
          ) 
      ) 
  ); 
 
  var imgViewerLink = $("#"+settings.imgViewerId).children(), 
      bigPic = imgViewerLink.children(), 
      showLoader = function(){ 
        imgViewerLink.html(loader); 
      }, 
      loadNewImg = function(){ 
        imgViewerLink.html($(this).fadeIn(250)); 
      }, 
      selectActiveThumb = function(){ 
        return thumbLinks.filter("." + settings.activeClass); 
      }; 
 
  thumbLinks.click(function(e){ 
    e.preventDefault(); 
    var $this = $(this), 
        target = $this.attr("href"); 
    if (bigPic.attr("src") == target) return; 
    highlight($this); 
    showLoader(); 
    bigPic 
      .load(loadNewImg) 
      .attr("src",target); 
  }); 
 
  imgViewerLink.click(function(e){ 
    e.preventDefault(); 
    if (thumbLinksSize < 2) return; 
    if (bigPic.attr("src") == lastThumbLink.attr("href")) var isLast = true; 
    highlight( 
      (isLast) 
        ? firstThumbLink 
        : selectActiveThumb().parent().next().children() 
    ); 
    showLoader(); 
    bigPic 
      .load(loadNewImg) 
      .attr( 
        "src", 
        (isLast) 
          ? firstThumbLink.attr("href") 
          : selectActiveThumb().attr("href") 
      ); 
  }); 
 
}); 

/*
function displayPics() 
{ 
    var photos = document.getElementById('galerie_liens') ; 
    // On rcupre l'lment ayant pour id galerie_mini 
    var liens = photos.getElementsByTagName('a') ; 
    // On rcupre dans une variable tous les liens contenu dans galerie_mini 
    var big_photo = document.getElementById('big_pict') ; 
    // Ici c'est l'lment ayant pour id big_pict qui est rcupr, c'est notre photo en taille normale 
 
    //var titre_photo = document.getElementById('photo').getElementsByTagName('dt')[0] ; 
    // Et enfin le titre de la photo de taille normale 
 
    // Une boucle parcourant l'ensemble des liens contenu dans galerie_mini 
    for (var i = 0 ; i < liens.length ; ++i) { 
        // Au clique sur ces liens  
        liens[i].onclick = function() { 
            big_photo.src = this.href; // On change l'attribut src de l'image en le remplaant par la valeur du lien 
            big_photo.alt = this.title; // On change son titre 
            this.className = 'conard';
            liens.className = 'salope';
            //titre_photo.firstChild.nodeValue = this.title; // On change le texte de titre de la photo 
            return false; // Et pour finir on inhibe l'action relle du lien 
        }; 
    } 
} 
window.onload = displayPics; 
// Il ne reste plus qu' appeler notre fonction au chargement de la page 
        
*/