image en cliqué et non cliqué

**gloglo** · 29/08/2007, 15h10

salut,

j'ai 3 boutons gris, ces boutons sont sous la forme de 3 images. Je veux que lorsqu'un bouton est séléctionné l'image change pour devenir foncé (une autre image à la place).

comment faire pour tetecter que mon bouton a été cliqué et que je dois dans ce cas mettre l'image en cliqué à la place.
merci

**jypees** · 29/08/2007, 16h12

Donc si j'ai bien compris ce que tu demandais je t'ai fais un petit code pour ce que tu souhaites faire :

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
 
<html>
	<head>
		<script language="javascript">
		function	 changedImg(inside)
		{
			checkclick = inside.getAttribute('clickImg');
			if (checkclick == 'false')
			{
				inside.src = 'http://www.developpez.net/forums/images/smilies/king.gif';
				inside.setAttribute('clickImg', 'true');
			}
			else
			{
				inside.src = 'http://www.developpez.net/forums/images/smilies/icon_cry.gif';
				inside.setAttribute('clickImg', 'false');
			}
		}
		</script>
	</head>
	<body>
		<img onclick="changedImg(this);" clickImg="false" src="http://www.developpez.net/forums/images/smilies/icon_cry.gif" />
		<img onclick="changedImg(this);" clickImg="false" src="http://www.developpez.net/forums/images/smilies/icon_cry.gif" />
		<img onclick="changedImg(this);" clickImg="false" src="http://www.developpez.net/forums/images/smilies/icon_cry.gif" />
	</body>
</html>

Dis moi ce que tu en penses et si ca te convient oublis pas de mettre résolu

**marsupix** · 29/08/2007, 17h06

perso je fais ça avec du css et la class ajax prototype :

- un classe .actif en css pour l'état cliqué
- tu inclus prototype.js
- ton bouton a l'ID monBouton par exemple

tu peux ajouter ou enlever des classes css à un élément avec :

Code :

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

$('monBouton').addClassName('actif')

et

Code :

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

Element.removeClassName($('monBouton'), 'actif')

Avantage : tu gère toujours le design en CSS et en mettant ça dans des fonctions tu peux réutiliser facilement le tout
Inconvénient : tu a besoin d'inclure prototype.js (mais on fait tellement de trucs bien avec :p)