Bonjour,
Je ne suis pas trés doué en javascript et je me suis inspiré de scripts vus sur internet pour développer la fonction suivante.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
 
function changepics(ref,titre)
{
document.getElementById('big_pict').src = ref;
document.getElementById('big_pict').alt = titre;
document.getElementById('photo').getElementsByTagName('dt')[0].firstChild.nodeValue = titre;
return false;
}
Mon script permet que lorsque l'on clique sur l'un des liens d'une des images miniatures. Cela appelle la fonction changepics et le src et le title de l'image agrandi sous le box des images miniatures.

Normalement l'action du lien <a> est inhibé par le return false mais ce n'est pas le cas lors des tests. C'est peut etre cela qui empêche ma fonction de s'executer correctement.

Voici mon script simplifié
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
34
35
36
37
38
39
 
<!doctype html public "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>essai</title>
 
<script type="text/javascript">
function changepics(ref,titre)
{
document.getElementById('big_pict').src = ref;
document.getElementById('big_pict').alt = titre;
document.getElementById('photo').getElementsByTagName('dt')[0].firstChild.nodeValue = titre;
return false;
}
</script>
</head>
 
<body>
<div style="width: 348px;" class="carousel-clip-region">
		<ul style="position: relative; left: 0px;" class="carousel-list carousel-horizontal" id="galerie_mini">
 
		<li id="dhtml-carousel-item-1"><a id="dhtml-carousel-a-0" href="images/thumb_18.jpg" onclick="return changepics('images/thumb_18.jpg','images/thumb_18.jpg')"><img id="dhtml-carousel-img-0" src="images/thumb_18.jpg" height="75" width="75">texte a afficher</a></li><li id="dhtml-carousel-item-2"><a id="dhtml-carousel-a-1" href="images/thumb_17.jpg" onclick="return changepics('images/thumb_17.jpg','images/thumb_17.jpg')"><img id="dhtml-carousel-img-1" src="images/thumb_17.jpg" height="75" width="75">texte a afficher</a></li><li id="dhtml-carousel-item-3"><a id="dhtml-carousel-a-2" href="images/thumb_16.jpg" onclick="return changepics('images/thumb_16.jpg','images/thumb_16.jpg')"><img id="dhtml-carousel-img-2" src="images/thumb_16.jpg" height="75" width="75">texte a afficher</a></li><li id="dhtml-carousel-item-4"><a id="dhtml-carousel-a-3" href="images/thumb_15.jpg" onclick="return changepics('images/thumb_15.jpg','images/thumb_15.jpg')"><img id="dhtml-carousel-img-3" src="images/thumb_15.jpg" height="75" width="75">texte a afficher</a></li></ul>
 
		</div>
 
		<dl id="photo">
		<dt class="foto">Titre de la photo 1</dt>
		<dd><img id="big_pict" src="image/aqua.jpg" class="reelfoto" alt="Photo 1 en taille normale" /></dd>
	</dl>	
 
 
 
</body>
 
 
 
 
</html>		
Merci d'avance pour votre aide,