Discussion :

[philippef]

Bonjour,

J'ai des photos miniatures et je voudrai afficher en grand la photo sélectionnée. J'entre bien dans la fonction mais la photo ne s'affiche pas !!

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<div id="img2018" class="photos2018">
	<p >
		Cliquez sur une photo pour l'agrandir
	</p>
	<p>
		<img src="images/rencontres/2018/20180420_194536.jpg" class="imgpm" onclick="showImg('20180420_194536.jpg');" alt="" />
		<img src="images/rencontres/2018/20180420_195526.jpg" class="imgpm" onclick="showImg('20180420_195526.jpg');" alt="" />
...
	</p>
</div>
<div id="imggm2018" class="photos2018">
	<p class="pcenter;">Cliquer pour fermer</p>
 
</div>

la fonction doit cacher la div img2018 et afficher l'image en grand format (71%) dans la div imggm2018

Code JavaScript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
function showImg(id){
/*alert(id);*/
	document.getElementById('img2018').style.display = "none";
	document.getElementById('imggm2018').style.display = "inline";
	document.getElementById('imggm2018').style.whidth = "71%";
	document.getElementById('imggm2018').src="images/rencontres/2018/"+id;
}

le

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
.photos2018 { text-align:center; background-color:#FFFFFF; }
.photos2018gm { text-align:center; background-color:#FFFFFF; display:none; }
.pcenter { text-align:center; }

Merci de me dire où est mon erreur

[nibors]

Bonjour,

tu as une typo dans ta fonction qui affiche l'image

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
function showImg(id){
/*alert(id);*/
	document.getElementById('img2018').style.display = "none";
	document.getElementById('imggm2018').style.display = "inline";
	document.getElementById('imggm2018').style.whidth = "71%";
	document.getElementById('imggm2018').src="images/rencontres/2018/"+id;
}

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById('imggm2018').style.whidth = "71%";

style.width et non wHidth

[NoSmoking]

Bonjour,
indépendamment de cette coquille,
lorsque l'on écrit <div id="imggm2018" class="photos2018"> on utilise un élément <div> et cet élément n'a pas d'attribut src comme les éléments <img>, donc ton code

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById('imggm2018').src="images/rencontres/2018/"+id;

ne fais rien de visible.

[javatwister]

Pense aussi à ce que ça va donner pour une galerie de x images...
Ta fonction devra s'adapter à chaque image: tu as compris le principe en récupérant l'id mais il faudrait maintenant enlever les appels de script "inline" pour rendre ton code facile à maintenir et plus lisible.