Aide pour affichage d'image au passage de souris HTML/CSS

Bonjours tout le monde,

je cherche une solution depuis plusieurs jours mais sans succès, je suis actuellement en train de créer un site sur les sciences en générale. J’ai fais une partie “Système solaire” , dès lors ou l’on clic sur le lien, on est envoyé sur une grande image sur système solaire qui est en pleine page. Ce que j’ai fais pour le moment, c’est mapper mon image avec des cercles pour rendre toute les planètes et le soleil cliquable. Ce que je voudrais faire ensuite, c’est au survol de zones mappées, un affichage d’une image préalablement crée qui décrit les caractéristiques des planètes. Mais voila, je ne trouve aucun moyen de faire ceci. Merci de bien vouloir m’aider, j’en est vraiment besoin!! :slight_smile:

PS: C’est aussi un des projets potentiels que je vais présenter pour mon épreuve de BTS

Merci!! :slight_smile:

Tu dois pouvoir le faire avec les attributs onmouseover + onmouseout le tout appliqué sur la zone associé à ta planète…

Y a des scripts d’affichage de bulles au survol d’un objet, base toi sur ceux-ci.

Merci! J’ai pratiquement réussi mais ce que je veux afficher en passant sur ma planète s’affiche en grand(plein écran) alors que je voudrais qu’une petite fenêtre s’affiche a coté de la souris. Est ce possible?

Voici comment je l’es écris:

Systeme Solaire

	<map name="systeme">

	<area onmouseover =  "document.images['IMG_1'].src='mercure.jpg';" onmouseout = "document.images['IMG_1'].src='systeme.jpg';"  shape="circle" coords="106, 369, 10" />

Je veux que l’image mercure s’affiche dans un format réduit a coté de la souris, merci

Personne? :frowning: