1 click = 1 zone en surbrillance : comment ?

Question

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

kilian · Answer

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:

Puis plus loin, tu crées un lien avec le nom de ta commune: La commune que tu veux 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....

Bobby · Answer

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.

Bobby · Answer

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.

Bobby · Answer

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.

kilian · Answer

Joli :-)C'est largement plus simple que le truc tarabiscoté que j'avais proposé :-)

Bobby · Answer

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 !

Bobby · Answer

note : cela fonctionne sous IE, et Firefox à partir de la version 1.0 me semble-t-il.

Bobby · Answer

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 ;-)

Bobby · Answer

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: carte

(france2.gif) par carte

(TA_CARTE)

Bobby · Answer

je sais pas si tu as tessté, mais ça ne doit pas marcher : il ne fallait pas mettre ce qui est entre parenthèses: carte

(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+

Edoc · Answer

[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!

Edoc · Answer

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

Edoc · Answer

c pas normal.tu l'ouvres bien avec  internet explorer ?

Edoc · Answer

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?)

Edoc · Answer

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 !

Edoc · Answer

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 !

Edoc · Answer

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 ?

Edoc · Answer

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 ...

Edoc · Answer

salut Franckeuuhhh ... non .c'est la bonne adresse ?

Edoc · Answer

Sorryy !!!!!C'est l'habitude du .com, je suis désolé . :-#c'est .FR !!!

Edoc · Answer

ok (je t'ai repondu par mail si tu cherches ici ;-)

1 click = 1 zone en surbrillance : comment ? - Page 2

Discussions similaires

Newsletters