Discussion :

[madislak]

Bonjour,

Je voudrais savoir s'il est possible (et si oui, comment on fait), pour qu'une image s'affiche au niveau d'un lien quand la souris passe dessus, mais sans utiliser de JavaScript, uniquement des <div> et du CSS.

Par exemple, j'ai une liste de liens qui pointent vers des images et je voudrais avoir un aperçu de l'image quand la souris passe sur le lien.

Merci d'avance

Mad.

[Halleck]

c'est possible en CSS:

Code css :

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

1
2
3
4
5
6
7
 
.lien img { 
     display:none; => cacher
}
.lien:hover img {
     display:block; => montrer
}

Code html :

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

1
2
3
4
5
 
<div class="lien">
     Un lien
     <img src="essai.gif" alt="" />
</div>

Et voilà

[madislak]

L'image est bien cachée au départ mais ne s'affiche pas après.

Par contre comme ça, ça marche nickel:

Code :

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

<a href='#' class="lien">Un lien<img src="test.jpg" alt=""></a>

Il ne me reste plus qu'a faire en sorte que l'image se superpose au reste, mais ça je trouverai c'est bon.

Merci beaucoup