C'est un problème classique qui est parfois nommé "rollover" dans la litérature (et dans Google).
Il y a plusieurs solutions, mais aucune n'est très simple et chacune a ses avantages et ses inconvénients. Il faudrait connaitre le contexte avec plus de précision.
Cependant, voici par exemple la solution que j'ai mise en oeuvre sur la page d'index de mon site perso.
Dans le header, je préload l'image pour gagner du temp ensuite.
<head>
<script language=javascript>
fleur1 = new Image
fleur1.src = 'rose.gif'
fleur2 = new Image
fleur2.src = 'tulipe.gif'
</script>
</head> |
Puis, dans le body, je mets :
<body>
<img src="tulipe.gif" border=0 name="img1">
<a href="http://blabla"
onmouseover="images['img1'].src=fleur1.src"
onmouseout="images['img1'].src=fleur2.src">voir une rose</a>
</body> |
Cela a pour effet d'afficher par défaut une tulipe, et lorque la souris survole un lien, cela affiche une rose.
