Comment changer une image au clic de la souris ?

Ce code va vous permettre de créer une image qui change au clic de la souris :

<script language="javascript">
    function changeImage() {

        if (document.getElementById("imgClickAndChange").src == "https://lh3.googleusercontent.com/-FlQgV42scck/VgaImXXriMI/AAAAAAAAi-M/L2SSj8eD9_U/s375-Ic42/ferme.png") 
        {
            document.getElementById("imgClickAndChange").src = "https://lh3.googleusercontent.com/--AAR_ePei1c/VgaHMX3FfYI/AAAAAAAAi90/5K5VSOsAJbM/s375-Ic42/ouvre.png";
        }
        else 
        {
            document.getElementById("imgClickAndChange").src = "https://lh3.googleusercontent.com/-FlQgV42scck/VgaImXXriMI/AAAAAAAAi-M/L2SSj8eD9_U/s375-Ic42/ferme.png";
        }
    }
</script>
<p>
<img alt="" src="https://lh3.googleusercontent.com/-FlQgV42scck/VgaImXXriMI/AAAAAAAAi-M/L2SSj8eD9_U/s375-Ic42/ferme.png
            id="imgClickAndChange" onclick="changeImage()"  />

</p>

il y a 2 adresses d'images différentes avant et après le clic.
Pour d'autres résultats changez l'adresse des images
Ce code donne le résultat suivant :



2 commentaires:

Anonyme a dit…

Désolé, j'ai effectué un essai. ça ne fonctionne pas. De cette façon :
src="Image/vignette_plus.gif" et src="Image/vignette_moins.gif". La deuxième image ne s'affiche pas au clic de la souris. On reste sur la première image. Si vous pouviez nous donner un exemple SVP . Merci d'avance.
Laurent

Matt a dit…

Bonjour Laurent, les liens du code étaient cassés. Voici un nouvel exemple pour le remplacer.

Enregistrer un commentaire