faire apparaître une image au survol d'un texte

**laurentSc** · 02/11/2012, 00h51

Bonsoir,

pour faire ce qui est dans le titre, j'ai fait ce code, mais il ne marche pas :

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
18
19
<head>
  <meta content="text/html; charset=ISO-8859-1"
 http-equiv="content-type">
  <title>test</title>
  <style>
function aff_img(_img) {
document.getElementById("+_img+").style.display="block";
}
function restore_vide(_img) {
document.getElementById("+_img+").style.display="none";
}
  </style>
</head>
<body>
<a href="#" onmouseover="aff_img('---')"
 onmouseout="restore_vide('---')">texte</a>
<img id="---" src="---.png"
 style="display: none;"/>
</body>

Pourquoi ?

**Bovino** · 02/11/2012, 08h23

Probablement parce que tu écris n'importe quoi...

Code html :

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

<img id="---" src="---.png" style="display: none;"/>

id="---", vraiment...

Code :

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

document.getElementById("+_img+").style.display="block";

il est où l'élément dont l'id est +_img+ ?

Reste ensuite à te renseigner sur les valeurs possibles d'un id, ce qui est le B.A.BA du métier de Webmaster...

**laurentSc** · 02/11/2012, 10h43

Vu que c'est n'importe quoi, j'ai un peu modifié le code en tenant compte de tes remarques et en me rapprochant d'un truc qui marche :

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
18
19
<head>
  <meta content="text/html; charset=ISO-8859-1"
 http-equiv="content-type">
  <title>test</title>
  <style>
function aff_img(img_) {
document.getElementsByClassName("+img_+").style.display="block";
}
function restore_vide(img_) {
document.getElementsByClassName("+img_+").style.display="none";
}
  </style>
</head>
<body>
<a href="#" onmouseover="aff_img(xxx)"
 onmouseout="restore_vide(xxx)">texte</a>
<img src="xxx.png" class="xxx"
 style="display: none;">
</body>

mais ça marche toujours pas et je vais répondre à tes questions :

il est où l'élément dont l'id est +_img+

maintenant une classe, et en fait une classe utilisée par l'image : class="xxx" et dont je passe le nom en paramètre de la fonction : onmouseover="aff_img(xxx)"

.

(et j'ai modifié ma signature pour me rapprocher de la vérité

)

**SpaceFrog** · 02/11/2012, 10h53

tu as des elements portant le nom de classe class="+img_+"???????????????

**Bovino** · 02/11/2012, 10h59

Et tu ne connais pas la différence entre un élément HTML et une collection...

**SpaceFrog** · 02/11/2012, 11h06

ni entre une variable et un string ...

Teste les codes ci dessous qui te permettront j'espère de comprendre ton erreur

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
function foo ( truc ){
 alert("truc")
}
 
function bar ( truc ){
 alert(truc)
}
 
 
foo('machin')
bar('machin')

**Bovino** · 02/11/2012, 14h16

Envoyé par laurentSc

et j'ai modifié ma signature pour me rapprocher de la vérité

Sincèrement, le problème n'est pas là...
Quand on regarde tes messages postés dans les différents forums : HTML, CSS, JavaScript ou PHP (pour n'en citer qu'un récent : http://www.developpez.net/forums/d12...e/#post6954759) on se rend compte que tu n'as manifestement jamais lu la moindre documentation (livre, formation voire tutoriels) concernant les domaines sur lesquels tu interviens alors que c'est la première des choses à faire. Ensuite, une fois que cela est fait et que tu as assimilé les bases, reste à te trouver des documentations de référence à consulter régulièrement !
Parmi celles-ci :

faire apparaître une image au survol d'un texte

JavaScript

Vue hybride

Discussions similaires

Partager

Partager