Afficher une image au passage de la souris sur un texte

**dede tabby** · 23/12/2012, 16h53

Bonjour,

Dans une page Html et de façon moderne comment Afficher une image au passage de la souris sur un texte ?

Débutant et ayant lu beaucoup de solutions proposées sur google recherche dont aucune ne fonctionne je me tourne vers votre site professionnel.

Merci d'avance

**NoSmoking** · 23/12/2012, 22h33

Bonsoir,
il n'est rien de très complexe dans la réalisation de ce que tu cherches à faire.

Il eut mieux valu que tu nous montres le code que tu n'arrives pas à faire fonctionner pour que l'on te corrige et t'explique.

**DezMax** · 01/01/2013, 17h03

Avec ce code utilisant Javascript l'image sera affichée au survol et cacher dès que la souris sort du champ de texte le petit code javascript change le style css en passant de display:none; à display:block; et inversement.
Exemple :

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
20
21
<html>
    <head>
 
    </head>
 
    <body>
        <script type="text/javascript">
        function show(){
                document.getElementById('image').style.display = 'block';
                }
                
                function hide(){
                document.getElementById('image').style.display = 'none';
                }
        </script>
 
 
		<a href="#" onmouseover="show();" onmouseout="hide();">MON TEXTE</a></br>
		<img id="image" style="display:none;" src="chemin_de_image.png"/>
    </body>
</html>

**NoSmoking** · 02/01/2013, 15h36

Dans ce cas autant utiliser la pseudo classe :hover.

Afficher une image au passage de la souris sur un texte

HTML

Discussions similaires

Partager

Partager