Augmenter une valeur contenue dans le src au click d'une image [Résolu/Fermé]

Signaler
Messages postés
2
Date d'inscription
vendredi 4 janvier 2013
Statut
Membre
Dernière intervention
5 janvier 2013
-
Alain_42
Messages postés
5374
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
-
Bonjour,

Pour les besoins d'un site web, je cherche à modifier une image de base par une série d'images en cliquant sur une bouton '+' ou '-' (qui est une image).

Il y a 6 images successives que j'aimerais afficher à chaque fois que l'utilisateur clique sur le "+" (images/n_1.png, si l'utilisateur clique sur + images/n_2.png s'affiche, si l'utilisateur clique encore sur +, images/n_3.png s'affiche, etc. etc). Dans la même idée, il y aurait un bouton moins.

J'arrive à modifier le .src de l'image mais que pour l'image n°2, ensuite je suis bloqué:
 <img src="images/n_1.png" id="guests">
<a href="#" onclick='javascript:document.getElementById("guests").src="images/n_2.png";'>


J'ai donc cherché à simplement faire un script pour modifier le n_1 en n_2 puis n_3 etc.. mais sans succès.
Je cherche également à limiter la possibilité du click sur le bouton "+" quand la valeur de l'image est à n_6 (le bouton deviendrait inclickable).

Est-ce que quelqu'un aurait des pistes pour ce genre de pb?

Un grand merci
Pac

3 réponses

Messages postés
5374
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
869
Salut, essayes comme ça:
<script type="text/javascript">
i=1; // variable globale pour mémoriser
function changer_src_image(){
	if(i<=6){
		i++;
	}else{
		i=6; //ou i=0 si tu veux recommencer à la 1
	}	
	document.getElementById("guests").src="images/n_"+i+".png";
}
</script>



<a href="#" onclick='javascript:changer_src_image();>
3
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 87095 internautes nous ont dit merci ce mois-ci

Messages postés
2
Date d'inscription
vendredi 4 janvier 2013
Statut
Membre
Dernière intervention
5 janvier 2013

Un grand merci Alain, ca fonctionne parfaitement et j'ai réussi à faire la même chose avec le bouton 'moins'

Encore merci :)
Messages postés
5374
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
869
ok, alors passes le sujet en résolu