Aide pour afficher élément en survol

Salut à tous,

je viens solliciter votre aide afin de savoir s'il est possible et comment le faire sur le code suivant, lors du survole de la souris sur l'image id "AP" que cette dernière affiche cette image: (http://swisselegancy.com/images/Autres/F.png)(taille original: 816px/700px à diviser par 2 pour le rendu (donc 408px/350px), en lieu et place de la balise object id "object1".

Si possible de ne passer que par un masquage/affichage, car la balise object est une video que je souhaite voir continuer à tourner après le retrait de la souris sur l'Ida "AP".

Merci d'avance pour vos info!

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<style type="text/css">
#tableau {
        height:364px;
        margin-top:1px;
        margin-bottom:1px;
        margin-left:77px;
        font-family: "Lucida Grande";
        font-size:9px;
        line-height:11px;
}
#description {
        width:250px;
        background-color:#FCF;
}
#AP {
        position:relative;
        top:1px;
        cursor: pointer;
        display:
}
#image {
        width:402px;
        text-align:left;
        background-color:#3CF;
}
</style>
<script type="text/javascript">
 
</script>
</head>
 
<body>
      <table id="tableau">
        <tr>
          <td id="description"><strong>A</strong> Détail <img id="AP" src="http://swisselegancy.com/images/Autres/Appareil_photo.png" alt="details" width="13" height="9"  /><br />
          <td id="image"><object id="object1" data="http://XXX.html" width="416px" height="358px"></object></td>
        </tr>
      </table>
 
</body>
</html>