Modifier l’attribut src d’une image avec JQuery

JQuery permet grâce à la propriété attr, de modifier les attributs d’un éléments sur un événement donné.

Il est possible par exemple de changer en Jquery l’image affectée à l’élément <img /> en modifiant son attribut « src « .

Ici on affecte l’image monimage.jpg à l’élément img d’identifiant #mon_image :

$("#mon_image").attr('src','monimage.jpg');  

Exemple de modification d’une image au survol de la souris (événement hover) 

Code HTML :

<img id="mon_image" src="monimage2.jpg" alt="survolez cette image "/>

Code JQuery :

$("#mon_image").hover(
   function () {
     $(this).attr('src','monimage1.jpg');  
   },
   function () {
      $(this).attr('src','monimage2.jpg');  
   }
); 

Exemple :