Bonjour à tous,
je suis face à un problème depuis quelques temps sur les options de la galerie d'images gérée par milkbox.js. Je cherche à ajouter des boutons "précédent" et "suivant" dans le cadre comme dans l'exemple ci joint : http://reghellin.com/milkbox/ . Après quelques modifications dans le script les boutons apparaissent mais ne fonctionnent pas alors que le bouton "close" oui... Je ne connais pas bien le langage javascript et si l'erreur viens de là pour moi c'est comme cherché une aiguille dans une botte de foin. Je vais vous donné un bout du code javascript puis css pour vous mettre sur la piste (ou pour télécharger le fichier Js : http://reghellin.com/milkbox/ en bas de la page).

Js______________________________________________________________
   
//next, prev, see next_prev_aux()
      this.next.addEvent('click',this.next_prev_aux.bindWithEvent(this,'next'));
      this.prev.addEvent('click',this.next_prev_aux.bindWithEvent(this,'prev'));
      
      //keyboard next/prev/close
      $(window.document).addEvent('keydown',function(e){
         if(this.mode != 'imageGallery' || this.busy == true){ return; };
         if(e.key == 'right' || e.key == 'space'){ this.next_prev_aux(e,'next'); }
         else if(e.key == 'left'){ this.next_prev_aux(e,'prev'); }
         else if(e.key == 'esc'){ this.closeMilkbox(); };
      }.bindWithEvent(this));
      
      
      //css hover doesn't work in ie6, so I must do it via js...
      $$(this.next,this.prev,this.close).addEvents({
            'mouseover':function(e){
               var button=($(e.target).match('a')) ? $(e.target) : $(e.target).getParent('a');
               button.setStyle('backgroundPosition',this.options.hoverBackgroundPosition);
            }.bindWithEvent(this),
            'mouseout':function(){ this.setStyle('backgroundPosition','0 0'); }
      });
      this.overlay = new Element('div', { 'id':'mbOverlay','styles':{ 'opacity':'0','visibility':'visible' }}).inject($(document.body));
      
      this.center = new Element('div', {'id':'mbCenter', 'styles':{'width':this.options.initialWidth,'height':this.options.initialHeight,'marginLeft':-(this.options.initialWidth/2),'opacity':0}}).inject($(document.body));
      this.image = new Element('div', {'id':'mbImage'}).inject(this.center);
      
      this.bottom = new Element('div',{'id':'mbBottom'}).inject(this.center).setStyle('visibility','hidden');
      this.navigation = new Element('div',{'id':'mbNavigation'}).setStyle('visibility','hidden');
      this.description = new Element('div',{'id':'mbDescription'}).setStyle('visibility','hidden');

      this.bottom.adopt(this.navigation, this.description, new Element('div',{'class':'clear'}));
      
      this.close = new Element('a',{'id':'mbCloseLink'});
      this.next = new Element('a',{'id':'mbNextLink'});
      this.prev = new Element('a',{'id':'mbPrevLink'});
      this.count = new Element('span',{'id':'mbCount'});
      
      $$(this.next, this.prev, this.count).setStyle('display','block');
      
      this.navigation.adopt(this.close, this.next, this.prev,new Element('div',{'class':'clear'}), this.count);

   }
   
});//END MILKBOX;

window.addEvent('domready', function(){
   Milkbox = new Milkbox();
});



CSS__________________________________________________________

#mbNavigation{
   float:right;
   width:27px;
   padding-top:3px;
   border-left:1px solid red;/* set nav border */
}


#mbCount{
   width:55px;
   overflow:hidden;
   padding-top:1px;
   float:right;
   text-align:right;
   font-size:9px; /* count font size */
}

#mbCloseLink, #mbPrevLink, #mbNextLink{
   outline:none;
   display:block;
   height:20px;
   cursor: pointer;
}


#mbPrevLink, #mbNextLink{ width:100px; }
#mbPrevLink{ background: transparent url('../../medias/img/skinMooFlow/prev.gif') no-repeat; }/* IMAGE: prev */
#mbNextLink{ background: transparent url('../../medias/img/skinMooFlow/next.gif') no-repeat; }/* IMAGE: next */

/* NOTE: doesn't work in ie6, so, just see the js options */
a#mbPrevLink:hover,a#mbNextLink:hover,a#mbCloseLink:hover { background-position: 0 -23px; }

#mbCloseLink {
   width:20px;
   background: transparent url('../../medias/img/skinMooFlow/close.gif') no-repeat;/* IMAGE: close */
}

Voilà merci d'avance pour tout renseignement utile!