Décaler une image au survol de la souris

Fermé
malabarbe Messages postés 127 Date d'inscription jeudi 20 septembre 2007 Statut Membre Dernière intervention 14 septembre 2016 - 28 août 2009 à 12:59
Bonjour à tous,

Ce que le source fait :
- Un RollOver sur l'image
- Au click, appel d'un lien
- Au survol de l'image curseur (Main)

Ce que je voudrais en plus, c'est qu'au survol de l'image,
celle-ci se déplace de 30 pixels sur la droite et revenir
a sa place d'origine quand plus de survol.

N'y arrivant pas avec le CSS, le JavaScript pourai
peut être le faire.

Code :
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<style type="text/css">
#bouge:hover
{
margin-left: 30px;
}

#bouge
{
cursor:pointer;
}

</style>
</head>
<body>

<table border="1" width="382" cellpadding="0" style="border-collapse: collapse" height="23" bordercolor="#0000FF">
<tr onClick="parent.frames['bas_droite'].location.replace('menu.php')">
<td bordercolor="#0000FF"><img id="bouge" border="0" onmouseover="this.src='../images/mg2-01-c.gif'" src="../images/mg2-01-f.gif"
alt=" Avec lien mais ne décale pas a droite."
onmouseout="this.src='../images/mg2-01-f.gif'"></a>
</td></tr>
</table>
</body></head>

Je ne sais pas si cela est faisable,
et si oui, comment ?