Lightbox et boutons prev/next
ebichu@
-
le hollandais volant Messages postés 4998 Date d'inscription Statut Membre Dernière intervention -
le hollandais volant Messages postés 4998 Date d'inscription Statut Membre Dernière intervention -
Bonjour!
J'ai mis en place la lightbox 2 grace à ce site:http://lokeshdhakar.com/projects/lightbox2/
Ca fonctionne bien:quand je clique sur une image elle m'amène bien à la suivante.
Et le bouton close apparait bien.
Par contre,impossible de faire apparaitre les boutons PREV et NEXT que ce soit sous ie ou firefox.
J'ai bien indiqué le bon chemin vers les images.(j'ai même essayé le chemin relatif et absolu).Mais rien à faire; :-(
Je vous indique le css de la lightbox.Peut être que quelque chose m'aura échappé
#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/extras/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/extras/nextlabel.gif) right 15% no-repeat; }
(D'ailleurs,je n'ai pas compris le "trick ie into showing hover")
Merci
J'ai mis en place la lightbox 2 grace à ce site:http://lokeshdhakar.com/projects/lightbox2/
Ca fonctionne bien:quand je clique sur une image elle m'amène bien à la suivante.
Et le bouton close apparait bien.
Par contre,impossible de faire apparaitre les boutons PREV et NEXT que ce soit sous ie ou firefox.
J'ai bien indiqué le bon chemin vers les images.(j'ai même essayé le chemin relatif et absolu).Mais rien à faire; :-(
Je vous indique le css de la lightbox.Peut être que quelque chose m'aura échappé
#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/extras/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/extras/nextlabel.gif) right 15% no-repeat; }
(D'ailleurs,je n'ai pas compris le "trick ie into showing hover")
Merci
A voir également:
- Lightbox et boutons prev/next
- A quoi servent les boutons de couleur sur une telecommande - Guide
- Comment réinitialiser un téléphone avec les boutons - Guide
- Application pour reconnaître les boutons - Accueil - Outils
- Opera next - Télécharger - Web & Internet
- Comment déverrouiller un samsung avec les boutons - Guide
1 réponse
Salut,
Les boutons "next" et "previous" n'apparaissent que si les images se suivent dans ton code HTML.
Quant à ça :
IE est un navigateur tellement merdique, il lui faut tout un tas d'instructions CSS en plus pour fonctionner.
Le url(data:image/gif;base64,AAAA); est un code pour intégrer une image au format Base64. C'est un format où l'image n'est pas un fichier externe, mais un code directement intégré dans le code CSS ou HTML.
Les boutons "next" et "previous" n'apparaissent que si les images se suivent dans ton code HTML.
Quant à ça :
#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
IE est un navigateur tellement merdique, il lui faut tout un tas d'instructions CSS en plus pour fonctionner.
Le url(data:image/gif;base64,AAAA); est un code pour intégrer une image au format Base64. C'est un format où l'image n'est pas un fichier externe, mais un code directement intégré dans le code CSS ou HTML.