Aide pour afficher élément en survol

**qwertz1** · 14/11/2012, 07h58

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 html :

Sélectionner tout - Visualiser dans une fenêtre à part

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>

**jnbrunet** · 14/11/2012, 21h08

Salut,

Tu peux essayer ceci:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 
window.onload = function(){
  var image = document.getElementById("AP");
  var imageWidth = image.getAttribute("width");
  var imageHeight= image.getAttribute("height");
  var imageSrc= image.getAttribute("src");
  image.onmouseover = function(e) {
    image.src="http://swisselegancy.com/images/Autres/F.png";
    image.width = "408px";
    image.height= "350px";
  }
  image.onmouseout = function(e) {
    image.src=imageSrc;
    image.width = imageWidth;
    image.height= imageHeight;
  }
}

Aide pour afficher élément en survol

JavaScript

Discussions similaires

Partager

Partager