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é:
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?
<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();>
