Discussion :

[thais781]

Bonjour,

Juste un petit soucis surement simple pour vous ..... mais moins pour une débutante comme moi ....

J'ai une carte avec des area, je voudrais que lorsque l'on survole la zone je puisse afficher un texte avec une petite image

Code :

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

1
2
3
4
5
6
7
8
function afficheId(baliseId)
{
    alert(baliseId)
}
function cacheId(baliseId)
{
....
}

Code html :

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

1
2
3
4
<center><img src="Data/Mytho.png" style="border:0" usemap="#Map"></center>
<map name="Map">
	<area shape="rect" href="debut.html" coords="0,0,200,200" onMouseOver="afficheId('bonjour');" onMouseOut="cacheId('bloc')">
</map>

Pour l'instant j'arrive juste a afficher un 'alert' au passage de la souris, mais pas de bulle ....

Une idée ?

Thais

[Lorenzo77]

salut,

la fonction alert n'a rien a voir avec une bulle d'aide !
commence par définir un DIV qui représente ta bulle, cache le et lors du mouseover, affiche le et positionne le sur la souris

[thais781]

Salut,

merci pour ton aide.
Je sais pour le alert, c'etait juste pour valider que quand je passe ma souris, je rentre bien dans la finction afficheId

Mais mon soucis est que je ne sais pas comment dans la fonction javascript faire l'affichage de la bulle ....

Thais

[NoSmoking]

Bonjour,
au moins 3 millions* de posts en parlent

Code :

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

1
2
oElem.style.display =' block'; // affiche l'élément
oElem.style.display = 'none';  // masque l'élément

*chiffre donné par les organisateurs, mais bien moins d'après les forces de l'ordre

[Lorenzo77]

c'est pas les sources qui manquent !

http://javascript.developpez.com/tut...t-avec-jquery/

[NoSmoking]

on peut également le faire en CSS, l’artillerie légère dans ce cas

[thais781]

Bonjour,

J'ai effectivement regardé plusieur post, mais mon soucis est de cumulé les 2 fonctions qui séparément marche nickel :

AREA et les bulles
:

Code html :

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

Each <a rel="tooltip" title="A paragraph or idea accompanied by <b>supporting details</b>">paragraph</a> <br>

et

Code html :

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

1
2
3
<map name="Map">
   <area shape="rect" href="Fiches.html" coords="127,156,202,200" >
</map>

Un peu comme sur le site de Météo France http://france.meteofrance.com/france/accueil

Thais