Défilement d'image à l'aide d'un clic

**stemariej** · 03/01/2010, 00h55

Bonjour,

Je dois créer un document HTML dans lequel il y a une séquence de huit images qui défile à chaque clique de souris. Présentement, je suis seulement capable de cliquer une fois car après il ne se passe plus rien. Voici mon code :

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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
 
<HTML>
<HEAD>
<TITLE>Changer une image lorsqu'on clique dessus</TITLE>
<SCRIPT language="JavaScript">
<!--
function change_img(source, indice) {
	document.images[indice].src = source;
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<H4>Cliquez sur l'image pour la changer</H4>
<A HREF="JavaScript:change_img('guepard8.gif',0)">
<IMG SRC="guepard1.gif"></A>
</BODY>
</HTML>

Merci beaucoup

Jonathan

**Auteur** · 03/01/2010, 11h38

bonjour,

après le premier changement d'image, tu ne modifies plus la source.

Code :

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

change_img('guepard8.gif',0)

à chaque clic sur l'image tu recharges donc l'image passée en paramètre c'est pour cette raison que tu as l'impression qu'il ne se passe rien.

Voilà un exemple de ce que tu peux faire :

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
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
40
41
42
43
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
 
<html>
<head>
<title>Changer une image lorsqu'on clique dessus</title>
<script type="text/javascript">
<!--
// liste des images que l'on va afficher
var tabImg = new Array(
                                "guepard1.gif", 
                                "guepard2.gif", 
                                "guepard3.gif",
                                "guepard4.gif",
                                "guepard5.gif",
                                "guepard6.gif",
                                "guepard7.gif", 
                                "guepard8.gif", 
                                "guepard9.gif", 
                                "guepard10.gif");
var n = 1;
function change_img(source) 
{
        document.getElementById(source).src = tabImg[n];
        n++;
        if (n >= tabImg.length)
                n = 0;
}
// -->
</script>
</head>
 
<body>
 
	<h4>Cliquez sur l'image pour la changer</h4>
 
	<span style="cursor: pointer" onclick="change_img('image1')">
		<img id="image1" src="guepard1.gif" alt=""/>
	</span>
 
</body>
 
</html>

Défilement d'image à l'aide d'un clic

JavaScript

Vue hybride

Discussions similaires

Partager

Partager