Bonjour,
J'aimerais intégrer sur mon site une galerie de photos mignature avec la possibilité d'afficher une grande version en cliquant dessus.
Cela marche très bien avec une photo verticale.
Pour une photo horizontale, j'aimerais modifier les propriétés width et height de la grande version à afficher selon l'orientation de la photo mignature.
J'ai repris l'idée du script que j'ai trouvé sur internet en ajoutant la variable img mais cela ne fonctionne pas![]()
Voici le code :
Je vous remercie pour votre aide!
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33 <script type="text/javascript"> function displayPics() { var photos = document.getElementById('galerie_mini') ; // On récupère l'élément ayant pour id galerie_mini var liens = photos.getElementsByTagName('a') ; var img = photos.getElementsByTagName('img'); // On récupère dans une variable tous les liens contenu dans galerie_mini var big_photo = document.getElementById('big_pic') ; // Ici c'est l'élément ayant pour id big_pic qui est récupéré, c'est notre photo en taille normale for(var i = 0 ; i < liens.length ; i++) // Une boucle parcourant l'ensemble des liens contenu dans galerie_mini { liens[i].onclick = function() // Au clique sur ces liens { big_photo.src = this.href ; // On change l'attribut src de l'image en le remplaçant par la valeur du lien if (img[i].width > img[i].height) { // Affichage photo (big_pic) horizontal ou vertical selon orientation photo mignature big_photo.width=340; big_photo.height=228; } else { big_photo.width=237; big_photo.height=355; } return false ; // Et pour finir on inhibe l'action réelle du lien } } } window.onload = displayPics ; // Il ne reste plus qu'à appeler notre fonction au chargement de la page </script>
Partager