infobulles et carte réactives

[Benedictum7]

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

[SStephane]

Voici un script qui doit certainement bien fonctionner : http://ljouanneau.com/softs/javascript/tooltip.php, et il semble bien documenté

[Benedictum7]

Merci pour le lien, je teste le source tout à l'heure mais une question : es ce possible d'insérer une image à l'intérieur de l'info bulle ?

Merci

[SStephane]

D'après la documentation, tu y mets à peu près ce que tu souhaites vu qu'il s'agit d'un <div>

[Benedictum7]

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>

[Benedictum7]

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