bob92000
Messages postés1Date d'inscriptionjeudi 27 mai 2010StatutMembreDernière intervention27 mai 2010
-
27 mai 2010 à 09:56
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).
//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'});
/* 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; }