1 click = 1 zone en surbrillance : comment ?

Franck -  
 Utilisateur anonyme -
bonjours, j'ai créé une carte géographique d'un département avec ses communes sur Paint. J'ai inscrit la liste de toutes les communes à coté. Je souhaiterais faire en sorte qu'en cliquant sur le nom d'un commune, celle-ci se mette en surbrillance sur ma carte. Si ce n'est pas trop compliqué pourriez vous me donner la marche à suivre ainsi que les outils nécessaires. Merci Franck

21 réponses

kilian Messages postés 8854 Statut Modérateur 1 526
 
Salut,

Regarde en haut à gauche sur cette page. Lorsque la souris passe au dessus de l'image de la maison, ou celle de l'imprimante etc... l'image se met soudain à changer.
A l'évènement onMouseover la page affiche telle image, avec onMouseout c'en est une autre.

Tu as juste à faire un peu la même chose avec onClick.Mais il faut pour ça que ton image soit découpée en plusieurs images. Et il faut que ces images possèdent leur double en surbrillance dans d'autres fichiers image....

Exemple tu affiches une image de commune comme ceci:
<img src="./commune.jpg" name="Nom_de_commune">


Puis plus loin, tu crées un lien avec le nom de ta commune:
<a href="/"  onClick="document.Nom_de_commune.src='./commune_surbrillance.jpg'";>La commune que tu veux</a>


Voilà, c'est assez inspiré de la source de la page où nous sommes, je pense que ça devrait marcher... C'est une solution comme une autre bien sûr....
1
franck
 
Merci kilian, j'ai compris ce que tu as dit (mouse over et mouse out) mais il faudrait remonter ton explication en amont car je ne sais pas où inscrire toutes ces informations ...!
0
kilian Messages postés 8854 Statut Modérateur 1 526
 
En fait pour commencer, imaginons que tu aies la carte de France (je prends ça comme exemple vu que je ne connais pas ta region).

A partir de cette carte globale tu crées plein de petites images, une pour chaque region... Il faudra découper ta carte avec un logiciel de tratement d'image. Et pour chacune de ces images-region, tu en crées une nouvelle avec des tons plus rouges ou..comme tu veux, ce sera tes images de surbrillance, il faut qu'elles soient de même taille que les originales).

Sur une page html tu reconstruis ta carte à partir de toutes ces images (celles qui ne sont pas en surbrillance), comme avec un puzzle. Ce sera peut être un peu fastidieux de faire ça directement en code html, essaie avec un logiciel comme dreamweaver (ou n'importe quel logiciel de ce genre).

Après tu retravaille le code html, par exemple pour
<img src="./ile_de_france">, tu remplaces par <img src="./ile_de_france" name="ile_de_france">


Le name sera en quelque sorte le référent de ton image.

Une fois que tu as donné un name à toutes tes images-regions, tu peux t'occuper des liens, par exemple pour le lien qui va vers l'image d'ile de france ça donne:
<a href="/" onClick="document.ile_de_france.src='./ile_de_france_surbrillance.jpg'">Carte de l'île de france</a>


Je t'explique ce que ça donne: une fois que tu cliques sur ce lien, la page cherche un truc qui a pour nom (notre fameux name) ile_de_france, il trouvera cet endroit, et en changera l'argument "src" pour lui dire de pointer vers une autre image.

Toutes les images seront ensemble dans un coin, et les liens seront ensemble dans un autre coin.
Tu devrais te retrouver avec un paragraphe d'insertion d'image, et un autre paragraphe d'insertion de liens. L'emplacement des liens et des images, ça c'est à toi de choisir. Tu peux, comme je le précisais avant, faire ta mise en page avec un logiciel comme nvu ou deamweaver, puis retoucher le code html après...

Recherche s'il n'existe pas une solution un peu moins lourde, personnelement je ne suis pas spécialiste en la matière.... et je ne voudrais pas te faire découper ta carte pour rien :-)
0
franck > kilian Messages postés 8854 Statut Modérateur
 
Merci peut etre qu'avec mouseover/mouseout ce sera plus simple ...?
0
kilian Messages postés 8854 Statut Modérateur 1 526 > kilian Messages postés 8854 Statut Modérateur
 
Ca reviendra au même, sauf que l'image changera lorsque le curseur passera sur le lien, ou l'image....au lieu de cliquer dessus.

Je viens de tester ce que je t'ai proposé, apparemment il faut changer:
<a href="/" onClick="document.ile_de_france.src='./ile_de_france_surbrillance.jpg'">Carte de l'île de france</a>

En:
<a href="javascript:;" onClick="document.ile_de_france.src='./ile_de_france_surbrillance.jpg'">Carte de l'île de france</a>


Dixit la source de cette page :-)
https://www.commentcamarche.net/contents/573-javascript-les-evenements

Désolé, je ne connais pas d'autre methode :-(
0
franck > kilian Messages postés 8854 Statut Modérateur
 
si je comprends bien mon département compte 139 communes, je dois
- les prendre 1 à1 et leur faire correspondre une meme image d'une couleur différente ;
- les prendre 1 à 1 et leur faire correspondre un lien correspondant à leur nom dont la liste est disposée à coté ;
ok
mais sur quel support dois inscrire tout celà ... ?
je vous rappelle que mon dessin est sur paint.
Merci !
0
Bobby
 
c'est vrai kilian je me suis un peu écarté du sujet initial,

je vais donc tenter de me rattraper en proposant un truc plus simple (pas d'inquiétude j'aime bien cezs petits bouts de code html !)

en attendant Franck je suis d'accord tu devrais aussi regarder des cours d'html
.
0
franck
 
Bonjours bobby j'ai lu la page html elle m'a beaucoup appris notemment pour crééer les polygonnes je crois d'ailleurs que ce serait la solution la + simple . Mais ce que je na sais pas c'est : une fois que j'ai ouvert une page bloc-note et tapé ce que tu m'a dit comment dois je introduire ma carte par ex. ?
0
Bobby
 
hello

tu dois placer ta carte dans le même répertoire que ton fichier.html, dont le nom est donné avec <img src="nom de la carte"

ainsi la carte sera chargée et affichée.
0
Bobby
 
voila g changé encore de technique, voivi le lien:

http://www.kidiwi.com/edoc/tout/zonedetest/2.php

fais affichage->afficher la source pour le code.
0
franck
 
super je vais opter pour cette option, ce sera + simple! mais pourrais tu m'indiquer comment trouver les valeurs x, y pour chaque ville ?
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
kilian Messages postés 8854 Statut Modérateur 1 526
 
Joli :-)

C'est largement plus simple que le truc tarabiscoté que j'avais proposé :-)
0
Bobby
 
hello
hier j'étais pressé.

alors si tu veux trouver les coordonnées d'une ville, cela dépend du type d'image que tu veux utiliser :

.bmp : paint doit te les fournir quand tu déplaces la souris sur l'image (en bas à droite)
.jpeg Microsoft photo editor sous win98,2000

ou un logiciel de retouche d'images pour tous avec "GIMP 2" (ce que j'ai fait) . téléchargeable =>sur www.gimp.org

attention les coordonnées que tu donnes sont celles du texte mais le Coin HAUT-GAUCHE.

voilà et n'hésite pas, les forums sont là pour aider !
0
Bobby
 
note :
cela fonctionne sous IE, et Firefox à partir de la version 1.0 me semble-t-il.
0
franck
 
Bonjour Bobby, voila
- j'ai repris exactement la source de la carte de france où il y avait paris et dijon;
- j'ai rajouté toutes les communes en fin de texte là où tu l'avais indiqué;
- j'ai mis toutes les cotes de chaque communes indiquées sur paint;

a présent que dois remplacer dans ce meme texte pour insérer ma carte ?

Puis comment créer le tableau où tu marque toutes tes villes ?
a+ merci
franck
0
franck
 
Bonjour Bobby, voila
- j'ai repris exactement la source de la carte de france où il y avait paris et dijon;
- j'ai rajouté toutes les communes en fin de texte là où tu l'avais indiqué;
- j'ai mis toutes les cotes de chaque communes indiquées sur paint;

a présent que dois remplacer dans ce meme texte pour insérer ma carte ?

Puis comment créer le tableau où tu marque toutes tes villes ?
a+ merci
franck
0
Bobby
 
ah oui c'est vrai tu ne connais pas trop la programmation...

alors en bref : une fonction sert à répéter un même traitement ;

moi je l'appelle pour insérer une ville (ajout_ville est une fonction). je lui passe des parametres qui sont les coordonnées (x et y) et le nom de la ville.

Cette fonction est définie au début du code, tu n'es pas obligé de t'en occuper, je l'ai faite moi-m^me.

Elle te permet d'ajouter "automatiquement" des villes dans la liste.

De meme le changement de couleur se fait tou seul.

----
ex:
si tu veux insérer une autre ville (Nantes de coordonnées 280,188)
tu écris dans la partie <script ... script> ton appel à la fonction, soit:

ajout_ville(280,188,"Nantes");

C'est tout, la liste sera remplie toute seule et tu n'as rien d'autre à toucher ;-)
0
Bobby
 
je te l'ai mis en exemple tjs sur le meme lien http://www.kidiwi.com/edoc/tout/zonedetest/2.php

pour insérer ta carte,
remplace:
<img border=0 src="france2.gif" alt="carte" name="MonImage">
(france2.gif)
par

<img border=0 src="TA_CARTE" alt="carte" name="MonImage">
(TA_CARTE)
0
franck
 
voilà ce que ça donne pour le département du Var:

<html>
<head>
<script language=javascript>
var villePred = "";
function ajout_ville(x, y, NomVille)
{
villePred = NomVille;
//calcul de la position de la ville (x et y)
var imgtmp=document.getElementById("MonImage");
x = x+imgtmp.style.left;

y = y+imgtmp.style.top;
//ajout de la ville sur la carte
document.write("<div id='"+NomVille+"' style='position:absolute; top:"+x+"px; left:"+y+"px; background-color:none; border:1px;'>"+NomVille+"</div>");
nouvElt = new Option(NomVille,NomVille,false,true);
document.all.selectVille.options[document.all.selectVille.length] = nouvElt;
}

function change(NomVille)
{
var idVilletmp=document.getElementById(NomVille);
if(villePred != "")
{
document.getElementById(villePred).style.background='none';
}
idVilletmp.style.background='red';<!--couleur à changer-->
villePred = NomVille;
}

</script>
</head>

<body>
<table><tr>
<td>
<img border=0 src=Communes_du_Var.gif" alt="carte" name="MonImage">(Communes_du_var.gif)

</td>

<td>
<select id="MonImage" name="selectVille" size="15" onChange="javascript:change(document.all.selectVille[document.all.selectVille.selectedIndex].text);">
</select>


</td></tr></table>


<!--ici on ajoute les villes avec la fonction ajout_ville, autant qu'on veut-->
<script language=javascript>

ajout_ville(477,388,"Adrets");
ajout_ville(254,289,"Aiguines");
ajout_ville(286,344,"Ampus");
ajout_ville(341,434,"Arcs s/Argent");
ajout_ville(179,312,"Artignosc");
ajout_ville(53,385,"Artigues");
ajout_ville(299,348,"Aups");
ajout_ville(423,392,"Bagnol en foret");
ajout_ville(37,649,"Bandol");
ajout_ville(364,282,"Bargème");
ajout_ville(258,341,"Bargemon");
ajout_ville(126,390,"Barjols");
ajout_ville(401,268,"Bastide");
ajout_ville(187,294,"Baudinard s/Verdon");
ajout_ville(215,297,"Bauduen");
ajout_ville(73,598,"Beausset");
ajout_ville(147,570,"Belgentier");
ajout_ville(215,513,"Besse s/Issole");
ajout_ville(288,601,"Bormes les mimosas");
ajout_ville(336,241,"Bourguet");
ajout_ville(123,444,"Bras");
ajout_ville(359,262,"Brenon");
ajout_ville(168,476,"Brignoles");
ajout_ville(109,411,"Brue-Auriac");
ajout_ville(233,462,"Cabasse");
ajout_ville(9,590,"Cadière d'Azur");
ajout_ville(374,377,"Callas");
ajout_ville(448,342,"Callian");
ajout_ville(182,495,"Camps la Source");
ajout_ville(284,491,"Cannet des Maures");
ajout_ville(234,409,"Carcès");
ajout_ville(219,542,"Carnoules");
ajout_ville(176,667,"Carqueiranne");
ajout_ville(37,578,"Castellet");
ajout_ville(369,608,"Cavalaire s/mer");
ajout_ville(143,492,"Celle");
ajout_ville(312,360,"Chateaudouble");
ajout_ville(134,421,"Chateauvert");
ajout_ville(373,246,"Chateauvieux");
ajout_ville(377,358,"Claviers");
ajout_ville(361,560,"Cogolin");
ajout_ville(273,566,"Collobrières");
ajout_ville(334,300,"Comps s/Artuby");
ajout_ville(169,434,"Correns");
ajout_ville(194,409,"Cotignac");
ajout_ville(192,622,"Crau");
ajout_ville(380,589,"Croix-Valmer");
ajout_ville(175,573,"Cuers");
ajout_ville(323,397,"Draguignan");
ajout_ville(229,412,"Entrecasteaux");
ajout_ville(67,383,"Esparon s/Verdon");
ajout_ville(93,607,"Evenos");
ajout_ville(163,620,"Farlède");
ajout_ville(416,355,"Fayence");
ajout_ville(338,379,"Figuanières");
ajout_ville(224,490,"Flassans s/Issole");
ajout_ville(284,396,"Flayosc");
ajout_ville(174,515,"Forcalqueiret");
ajout_ville(176,368,"Fox-Amphoux");
ajout_ville(449,420,"Fréjus");
ajout_ville(155,639,"Garde");
ajout_ville(330,522,"Garde-Freinet");
ajout_ville(159,520,"Garéoult");
ajout_ville(388,564,"Gassin");
ajout_ville(58,336,"Ginasservis");
ajout_ville(263,518,"Gonfaron");
ajout_ville(365,537,"Grimaud");
ajout_ville(206,642,"Hyères");
ajout_ville(312,627,"Lavandou");
ajout_ville(233,601,"Londe les Maures");
ajout_ville(282,428,"Lorgues");
ajout_ville(262,493,"Luc en Pce.");
ajout_ville(376,262,"Martre");
ajout_ville(297,531,"Mayons");
ajout_ville(90,515,"Mazaugues");
ajout_ville(117,554,"Méounes lès Montrieux");
ajout_ville(196,338,"Moissac-Bellevue");
ajout_ville(351,583,"Molle");
ajout_ville(427,300,"Mons");
ajout_ville(465,351,"Montauroux");
ajout_ville(157,340,"Montmeyan");
ajout_ville(326,335,"Montferrat");
ajout_ville(187,432,"Montfort s/Argent");
ajout_ville(370,410,"Motte");
ajout_ville(378,434,"Muy");
ajout_ville(47,502,"Nans les Pins");
ajout_ville(156,541,"Néoules");
ajout_ville(59,419,"Ollières");
ajout_ville(84,635,"Ollioules");
ajout_ville(211,570,"Pierrefeu du Var");
ajout_ville(248,537,"Pignan");
ajout_ville(5,523,"Plan d'Aups");
ajout_ville(363,503,"Plan de la tour")
ajout_ville(161,394,"Pontevès");
ajout_ville(47,453,"Pourcieux");
ajout_ville(13,424,"Pourrières");
ajout_ville(154,659,"Pradet");
ajout_ville(198,550,"Puget ville");
ajout_ville(417,431,"Puget s/Argent");
ajout_ville(414,576,"Ramatuelle");
ajout_ville(179,330,"Régusse");
ajout_ville(118,609,"Revest les eaux");
ajout_ville(24,366,"Rians");
ajout_ville(36,546,"Riboux");
ajout_ville(178,535,"Rocbaron");
ajout_ville(390,288,"Roque-Esclapon");
ajout_ville(393,457,"Roquebrunne /Argent");
ajout_ville(125,524,"Roquebrussanne");
ajout_ville(343,628,"Royol-Canadel s/mer");
ajout_ville(78,497,"Rougiers");
ajout_ville(192,516,"Saint-Anastasie");
ajout_ville(254,416,"Saint-Antonin du Var");
ajout_ville(5,620,"Saint-Cyr s/mer");
ajout_ville(91,310,"Saint-Julien");
ajout_ville(121,681,"Saint-Mandrier");
ajout_ville(88,389,"Saint-Martin");
ajout_ville(486,431,"Saint-Raphael");
ajout_ville(5,496,"Saint-Zacharie");
ajout_ville(425,542,"Saint-Tropez");
ajout_ville(400,514,"Sainte-Maxime");
ajout_ville(409,375,"saint-Paul en foret");
ajout_ville(232,390,"Salernes");
ajout_ville(195,258,"Salles s/Verdon");
ajout_ville(58,639,"Sanary s/mer");
ajout_ville(75,447,"Saint-Maximin");
ajout_ville(381,317,"Seillans");
ajout_ville(81,422,"Seillons-Source Ag");
ajout_ville(98,659,"Seyne s/mer");
ajout_ville(78,550,"Signes");
ajout_ville(193,384,"Sillans la Cascade");
ajout_ville(47,674,"Six-Four les plages");
ajout_ville(170,598,"Solliès-Pont");
ajout_ville(131,588,"Solliès-Toucas");
ajout_ville(147,606,"Solliès-Ville");
ajout_ville(490,361,"Tanneron");
ajout_ville(337,415,"Taradeau");
ajout_ville(117,633,"Toulon");
ajout_ville(431,336,"Tourrette");
ajout_ville(264,363,"Tourtour");
ajout_ville(107,478,"Tourves");
ajout_ville(253,440,"Thoronet");
ajout_ville(335,414,"Trans en Pce.");
ajout_ville(307,270,"Trigance");
ajout_ville(142,369,"Tavernes");
ajout_ville(163,457,"Val");
ajout_ville(135,624,"Vallette du Var");
ajout_ville(112,369,"Varages");
ajout_ville(116,342,"Verdière");
ajout_ville(245,321,"Vérignon");
ajout_ville(330,476,"Vidauban");
ajout_ville(29,296,"Vinon s/Verdon");
ajout_ville(192,458,"Vins s/Caramy");
ajout_ville(254,386,"Villecroze");

</script>

</body></html>
0
aldo13 Messages postés 490 Statut Membre 103
 
Salut ,

On peut la trouver ou ta carte du Var ?
0
Bobby
 
je sais pas si tu as tessté, mais ça ne doit pas marcher :

il ne fallait pas mettre ce qui est entre parenthèses:
<img border=0 src=Communes_du_Var.gif" alt="carte" name="MonImage">(Communes_du_var.gif)

le " (Communes_du_var.gif) ", je l'ai rajouté pour préciser, là il sera affiché sur la page, ce qui n'est pas nécessaires. D plus,
fais attention tu as oublié un apostrophe (") => src="Communes_du_Var.gif"
la source de ton image(son nom ici) est entre " ".

Pour comprendre l'HTML:

le texte écrit simplement est affiché dans la page.
le texte écrit entre <> est interprété = traduit pour l'affichage (ce sont des balises)
donc pour cette image IMG on spécifie son nom, pas de bordures la source et le texte affiché quand la souris passe dessus.

a+
0
franck
 
Merci encore Bobby, j'ai effectué les rectifications , j'ai toujours un fichier .txt
-comment le convertir en .HTML ? (le bloc-notes ne propose que Unicode, ANSI, UTF-8, Big Indian)
-dois passer par NVU ?
Merci !
0
kilian Messages postés 8854 Statut Modérateur 1 526
 
Salut,


Tu as juste à renommer ta page avec l'extension html.
0
Utilisateur anonyme
 
[c Bobby qui change de nom ]

oui :précisément,sous le bloc-notes,
1)tu choisis "tous les fichiers" (ou un truc comme ca) dans "Type de fichier" au lieu de "*.txt".
2)tu fais Sauvegarder Sous, et dans le nom du fichier tu mets ton fichier avec l'extension .html (comme l'a dit killian)

ca devrait aller!
0
franck
 
ça ne marche pas : aprés avoir modifié l'extension il me dit : "Communes_du_Var.HTML.txt existe déjà voulez vous le remplacer ?"
j'ai essayé de modifier les propriétés du fichier "s'ouvre avec..." et remplacé "paint " par "internet explorer", non plus !
auriez vous une autre solution ?
0
Utilisateur anonyme
 
il me semble que tu as oublié de spécifier le type du fichier comme je t'ai dis :

Dans Type de fichier, il y a deux choix
-un qui ressemeble à"*.txt"
-et tu prens l'autre : cela te permettra de donner l'extension que tu veux ;-)

à ce moment tu peux écrire le nom de ton fichier ommunes_du_Var.html

essaie !

si il te dit que le fichier existe déjà ça veut dire que
0
franck
 
non, j'ai bien fait comme tu me l'a dis "tous fichiers" et il répond :
le fichier Communes_du_Var.html.txt existe déjà voulez vous le remplacer ?
le probleme c'est qu'il garde l'extension "txt" malgré la modification ...
0
franck
 
Ca y est,
j'ai réussi à convertir ma page texte (bloc-notes) en page HTML ("document html" d'aprés "propriétés")....
seulement si je l'ouvre, je découvre le meme texte en page web...
il n'y a pas de carte !
j'ai du oublier une étape, qu'est ce que vous en pensez ?
0
Utilisateur anonyme
 
c pas normal.

tu l'ouvres bien avec internet explorer ?
0
Utilisateur anonyme
 
j'ai testé le code et cela fonctionne.

j'ai une autre idée. Peut-etre que ta carte n'a pas l'eextension .GIF comme la mienne.

Si ton image vient de paint, alors elle a peut etre été enregistrée en .BMP

->sous windows, pour voir les extensions (tous les fichiers ont une extension pour différencier leurs types, et elles n'apparaissent peut-etre pas par défaut chez toi), dans un répertoire, tu cliques sur
Affichage=>Options des dossiers=>affichage=> tu décoches la ligne "afficher les extensions dont le type est connu". Ainsi toutes les extensions seront visibles dans le futur.

Même manip' pour les cacher ,en cochant la case.

---------
maintenant tu dois pouvoir voir l'extension de ton image (son nom complet) avec un .BMP (ou autre) dans son nom.

C'est ce nom-là que tu écris à la place de "Communes_du_Var.gif".

j'espère que tu vas y parvenir ;-)

ps: une question comme ça: dans quel cadre dois-tu réaliser cette carte ? (perso, boulot, études?)
0
franck
 
Le but est perso.
ça y est j'ai la carte,
avec le cadre pour y mettre les communes ... mais elles n'y figurent pas (décidément ! je ne désespère pas ... on va y arriver !)
Il doit me manquer une manipulation ...
0
Utilisateur anonyme
 
Alors une question :

Quel navigateur possèdes-tu?

Internet explorer => peut-être que tu as une ancienne version qui ne comprend pas le "code". =>aujourd'hui on est à la version 6 , tu peux vérifier ta version en lancant Internet explorer puis "?" dans le menu suivi de "A propos de Internet Explorer" :

la version est écrite comme cela :"Version : ...".

Pour avoir la version 6, va sur http://www.microsoft.com/france/internet/produits/ie/default.mspx

--------

ou alors tu peux installer Firefox, un navigateur à la mode en ce moment (que j'utilise): http://www.firefox.fr/windows.htm

Allez Courage !
0
franck
 
Bonjours Edoc, j'ai internet explorer 6 version 6.0.299.2182.XP.SP2
c'est quoi le code ?
0
franck
 
Bonjours Edoc, j'ai internet explorer 6 version 6.0.299.2182.XP.SP2
c'est quoi le code ?
0
franck
 
Bonjours Edoc, j'ai internet explorer 6 version 6.0.299.2182.XP.SP2
c'est quoi ce que tu appelle le code ?
0
Utilisateur anonyme
 
hello

eh bien le code c'est toutes les lignes (de code) que j'ai écrites, ce qui fait le programme si tu veux.

donc ca ne vient pas de ton navigateur, et ça ne fonctionne tjs pas ?

peux tu reécrire tout ton code afin que je le teste ?

merci !
0
franck
 
Tout est là :

<html>
<head>
<script language=javascript>
var villePred = "";
function ajout_ville(x, y, NomVille)
{
villePred = NomVille;
//calcul de la position de la ville (x et y)
var imgtmp=document.getElementById("MonImage");
x = x+imgtmp.style.left;

y = y+imgtmp.style.top;
//ajout de la ville sur la carte
document.write("<div id='"+NomVille+"' style='position:absolute; top:"+x+"px; left:"+y+"px; background-color:none; border:1px;'>"+NomVille+"</div>");
nouvElt = new Option(NomVille,NomVille,false,true);
document.all.selectVille.options[document.all.selectVille.length] = nouvElt;
}

function change(NomVille)
{
var idVilletmp=document.getElementById(NomVille);
if(villePred != "")
{
document.getElementById(villePred).style.background='none';
}
idVilletmp.style.background='red';<!--couleur à changer-->
villePred = NomVille;
}

</script>
</head>

<body>
<table><tr>
<td>
<img border=0 src="Communes_du_Var.gif" alt="carte" name="MonImage"><!-- tout/zonedetest/ -->

</td>

<td>
<select id="MonImage" name="selectVille" size="15" onChange="javascript:change(document.all.selectVille[document.all.selectVille.selectedIndex].text);">
</select>


</td></tr></table>



<!--ici on ajoute les villes avec la fonction ajout_ville, autant qu'on veut-->

<script language=javascript>

ajout_ville(477,388,"Les Adrets");
ajout_ville(254,289,"Aiguines");
ajout_ville(286,344,"Ampus");
ajout_ville(341,434,"Les Arcs s/Argent");
ajout_ville(179,312,"Artignosc");
ajout_ville(53,385,"Artigues");
ajout_ville(299,348,"Aups");
ajout_ville(423,392,"Bagnol-en-foret");
ajout_ville(37,649,"Bandol");
ajout_ville(364,282,"Bargème");
ajout_ville(258,341,"Bargemon");
ajout_ville(126,390,"Barjols");
ajout_ville(401,268,"La Bastide");
ajout_ville(187,294,"Baudinard s/Verdon");
ajout_ville(215,297,"Bauduen");
ajout_ville(73,598,"Le Beausset");
ajout_ville(147,570,"Belgentier");
ajout_ville(215,513,"Besse s/Issole");
ajout_ville(288,601,"Bormes-les Mimosas");
ajout_ville(336,241,"Le Bourguet");
ajout_ville(123,444,"Bras");
ajout_ville(359,262,"Brenon");
ajout_ville(168,476,"Brignoles");
ajout_ville(109,411,"Brue-Auriac");
ajout_ville(233,462,"Cabasse");
ajout_ville(9,590,"La Cadière d'Azur");
ajout_ville(374,377,"Callas");
ajout_ville(448,342,"Callian");
ajout_ville(182,495,"Camps-la-Source");
ajout_ville(284,491,"Le Cannet des Maures");
ajout_ville(234,409,"Carcès");
ajout_ville(219,542,"Carnoules");
ajout_ville(176,667,"Carqueiranne");
ajout_ville(37,578,"Le Castellet");
ajout_ville(369,608,"Cavalaire s/mer");
ajout_ville(143,492,"La Celle");
ajout_ville(312,360,"Chateaudouble");
ajout_ville(134,421,"Chateauvert");
ajout_ville(373,246,"Chateauvieux");
ajout_ville(377,358,"Claviers");
ajout_ville(361,560,"Cogolin");
ajout_ville(273,566,"Collobrières");
ajout_ville(334,300,"Comps s/Artuby");
ajout_ville(169,434,"Correns");
ajout_ville(194,409,"Cotignac");
ajout_ville(192,622,"La Crau");
ajout_ville(380,589,"La Croix-Valmer");
ajout_ville(175,573,"Cuers");
ajout_ville(323,397,"Draguignan");
ajout_ville(229,412,"Entrecasteaux");
ajout_ville(67,383,"Esparon s/Verdon");
ajout_ville(93,607,"Evenos");
ajout_ville(163,620,"La Farlède");
ajout_ville(416,355,"Fayence");
ajout_ville(338,379,"Figuanières");
ajout_ville(224,490,"Flassans s/Issole");
ajout_ville(284,396,"Flayosc");
ajout_ville(174,515,"Forcalqueiret");
ajout_ville(176,368,"Fox-Amphoux");
ajout_ville(449,420,"Fréjus");
ajout_ville(155,639,"La Garde");
ajout_ville(330,522,"La Garde-Freinet");
ajout_ville(159,520,"Garéoult");
ajout_ville(388,564,"Gassin");
ajout_ville(58,336,"Ginasservis");
ajout_ville(263,518,"Gonfaron");
ajout_ville(365,537,"Grimaud");
ajout_ville(206,642,"Hyères");
ajout_ville(312,627,"Lavandou");
ajout_ville(233,601,"La Londe-les Maures");
ajout_ville(282,428,"Lorgues");
ajout_ville(262,493,"La Luc en Pce.");
ajout_ville(376,262,"La Martre");
ajout_ville(297,531,"Les Mayons");
ajout_ville(90,515,"Mazaugues");
ajout_ville(117,554,"Méounes-lès Montrieux");
ajout_ville(196,338,"Moissac-Bellevue");
ajout_ville(351,583,"La Molle");
ajout_ville(427,300,"Mons");
ajout_ville(465,351,"Montauroux");
ajout_ville(157,340,"Montmeyan");
ajout_ville(326,335,"Montferrat");
ajout_ville(187,432,"Montfort s/Argent");
ajout_ville(370,410,"La Motte");
ajout_ville(378,434,"Le Muy");
ajout_ville(47,502,"Nans-les Pins");
ajout_ville(156,541,"Néoules");
ajout_ville(59,419,"Ollières");
ajout_ville(84,635,"Ollioules");
ajout_ville(211,570,"Pierrefeu du Var");
ajout_ville(248,537,"Pignan");
ajout_ville(5,523,"Plan d'Aups");
ajout_ville(363,503,"Plan de la tour")
ajout_ville(161,394,"Pontevès");
ajout_ville(47,453,"Pourcieux");
ajout_ville(13,424,"Pourrières");
ajout_ville(154,659,"Le Pradet");
ajout_ville(198,550,"Puget ville");
ajout_ville(417,431,"Puget s/Argent");
ajout_ville(414,576,"Ramatuelle");
ajout_ville(179,330,"Régusse");
ajout_ville(118,609,"Revest-les eaux");
ajout_ville(24,366,"Rians");
ajout_ville(36,546,"Riboux");
ajout_ville(178,535,"Rocbaron");
ajout_ville(390,288,"La Roque-Esclapon");
ajout_ville(393,457,"Roquebrunne s/Argent");
ajout_ville(125,524,"Roquebrussanne");
ajout_ville(343,628,"Le Royol-Canadel s/mer");
ajout_ville(78,497,"Rougiers");
ajout_ville(192,516,"Saint-Anastasie");
ajout_ville(254,416,"Saint-Antonin du Var");
ajout_ville(5,620,"Saint-Cyr s/mer");
ajout_ville(91,310,"Saint-Julien");
ajout_ville(121,681,"Saint-Mandrier");
ajout_ville(88,389,"Saint-Martin");
ajout_ville(486,431,"Saint-Raphael");
ajout_ville(5,496,"Saint-Zacharie");
ajout_ville(425,542,"Saint-Tropez");
ajout_ville(400,514,"Sainte-Maxime");
ajout_ville(409,375,"saint-Paul en foret");
ajout_ville(232,390,"Salernes");
ajout_ville(195,258,"Les Salles s/Verdon");
ajout_ville(58,639,"Sanary s/mer");
ajout_ville(75,447,"Saint-Maximin");
ajout_ville(381,317,"Seillans");
ajout_ville(81,422,"Seillons-Source d'Argens");
ajout_ville(98,659,"La Seyne s/mer");
ajout_ville(78,550,"Signes");
ajout_ville(193,384,"Sillans-la Cascade");
ajout_ville(47,674,"Six-Four-les plages");
ajout_ville(170,598,"Solliès-Pont");
ajout_ville(131,588,"Solliès-Toucas");
ajout_ville(147,606,"Solliès-Ville");
ajout_ville(490,361,"Tanneron");
ajout_ville(337,415,"Taradeau");
ajout_ville(117,633,"Toulon");
ajout_ville(431,336,"Tourrette");
ajout_ville(264,363,"Tourtour");
ajout_ville(107,478,"Tourves");
ajout_ville(253,440,"Le Thoronet");
ajout_ville(335,414,"Trans en Pce.");
ajout_ville(307,270,"Trigance");
ajout_ville(142,369,"Tavernes");
ajout_ville(163,457,"Le Val");
ajout_ville(135,624,"La Vallette du Var");
ajout_ville(112,369,"Varages");
ajout_ville(116,342,"Verdière");
ajout_ville(245,321,"Vérignon");
ajout_ville(330,476,"Vidauban");
ajout_ville(29,296,"Vinon s/Verdon");
ajout_ville(192,458,"Vins s/Caramy");
ajout_ville(254,386,"Villecroze");

</script>

</body></html>
0
Utilisateur anonyme
 
et ça ne fonctionne pas ?

je viens de faire un copier-coller de ce code dans le bloc-notes,
j'ai enregistré sous fichier.html

et en ouvrant le fichier dans IE tout fonctionne ! (sauf que je n'ai pas l'image, mais c pas grave)

quel est donc le problème ?
0
franck
 
moi j'ai l'image et le tableau mais il est vide !!
0
Utilisateur anonyme
 
et tu n'as pas les villes d'affichées sur la carte je suppose ...

si tu sais faire et que ca ne te dérange pas, envoie-moi ton fichier html par mail : edoc at hotmail . com

;-)
bizzarre ...
0
franck
 
Bonjours Edoc... à tu reçu mes fichiers ...?
0
Utilisateur anonyme
 
salut Franck

euuhhh ...
non .

c'est la bonne adresse ?
0
Utilisateur anonyme
 
Sorryy !!!!!
C'est l'habitude du .com, je suis désolé . :-#

c'est .FR !!!
0
franck
 
j'envoie !
0