Aller au contenu

infobulles et carte réactives


Benedictum7

Sujets conseillés

Bonjour,

Je suis à la recherche d'un code Ajax ou javasript qui pourrait me permettre d'afficher une infobulle au-dessus des zones réactives d'une carte à l'exemple de ce site :http:// france.meteofrance.com. J'ai déjà pu créer la carte mais je ne sais pas comment faire afficher les infos bulles.

Merci

Lien vers le commentaire
Partager sur d’autres sites

Je reviens à la charge. ce code source ne règle pas mon soucis. En réalité je dispose d'une carte avec des zones réactives et je souhaite qu'au survaol de chaque zone une infobulle contenant une image s'affiche. Voici donc un extrait de la source :

<script type="text/javascript" src="tooltip.js"></script>

<div id="tooltip" style="position:absolute;visibility:hidden;background-color:#FFEEC7;border:1px solid black;padding:0.2em;font-size:0.8em;"></div>

<img src="images/carteimplantationbtci02.jpg" width="171" height="399" border="0" alt="" usemap="#carteimplantationbtci02_Map">

<map name="carteimplantationbtci02_Map">

<area shape="rect" alt="Agence de cinkasse" coords="66,18,77,30" href="CinKasse" >

<area shape="rect" alt="Agence de Dapaong" coords="23,13,34,25" href="Dapaong">

<area shape="rect" alt="Agence de Kara" coords="106,117,124,132" href="Kara">

<area shape="rect" alt="Agence de Sokode" coords="97,161,120,181" href="Sokode">

<area shape="rect" alt="Agence d'Atakpame" coords="103,269,124,289" href="Atakpame">

<area shape="rect" alt="Agence de Lome" coords="105,379,123,395" href="lome.html">

<area shape="rect" alt="Agence de kpalime" coords="67,322,84,336" href="kpalime.html" onmouseover="tooltip.show(this)" onmouseout="tooltip.show(this)"

title="Hello you !">

</map>

Lien vers le commentaire
Partager sur d’autres sites

J'ai réussi à afficher le texte au survol de la zonz réactive mais pas l'image.

<div onmouseover="tooltip.show(this)" onmouseout="tooltip.hide(this)" title="Ville B.">

<area shape="rect" alt="Agence de kpalime" coords="67,322,84,336" href="B.html">

</div>

Une personne aurai une idée un lien je suis preuneur

Merci

Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...