ROLLOVER image décalée

Bonjour tout le monde, je suis nouveau sur ce forum.
J ai besoin d aide pour une ligne de commande en java, je m' explique:
J' ai effectué un rollover(jusque là pas de souci) mais j aimerai qu' au passage du curseur sur la première image que celle ci reste apparente et que la seconde apparaisse un peu plus loin sur l'écran.Comment est-ce réalisable??
Merci d'avance pour vôtre aide.Voilà mes scripts:
html:`

Code:

---

1 2	<a href="#" onmouseover="bouton.src = '../images/sphere2.png';" onmouseout="bouton.src = '../images/sphere.png';"><img src="../images/sphere.png" border=0 width="50" height="50" name=bouton></a>

---

javascript :

Code:

---

1 2	bouton = new Image(); bouton.src = "../images/sphere2.png";

---

Code:

---

doucmentgetElementsByName('bouton')[0].scr....

---

mais je conseillerais plutot de passer par un id ...

Code:

---

1 2	<a href="#" onmouseover="document.getELementById('bouton1').src = '../images/sphere2.png';" onmouseout="document.getELementById('bouton1').src.src = '../images/sphere.png';"><img src="../images/sphere.png" border=0 width="50" height="50" name="bouton" id='bouton1'></a>

---

ha heu un peu plus loin ???
ben mets une balise image un peu plus loin ..
donne lui un autre id .. mets la en display:none et bascules en display:block ...

donc il faut que je mette 2 balises <id> dans la même ligne de commande pour que la première images reste apparente et que la seconde image apparaisse plus loin pour l'effet roll over...???