map monde avec liens sur pays Résolu

Question

hello,


j'aimerai bien mettre en ligne une carte du monde ou on pourrait cliquer sur les pays et aisni se retrouver sur une autre page du site consacrée à ce pays.

Alors est ce que je dois faire la carte sous flash mais alors je dois mettre le code du lien sous flash?? ou sinon est ce que je dois m'y prendre autrement...

tte suggestion est la bienvenue

merci

Dalida · Accepted Answer

on peux fêter notre 50ème message!!! ;-) je ne refuse jamais une invitation au café !!! d'ailleurs tu n'as pas respecté la tradition qui veut que les nouveaux membres se présenter au café et paient la tournée… la honte !!! -:op mais bon ! moi j'dis ça, j'dis rien… j'en ai parcouru du chemin depuis alors merci à toi de me faire partager tes compétences en la matiére et de prendre le temps pour m'expliquer tout ca... est-ce que tu veux de la doc ? les cours et les tutos c'est un passage obligé, surtout si tu veux partir sur des bases saines. sinon ca fonctionne toujours pas....:-( hum, hum (quinquies)… -;op je viens de regarder ton code plus sérieusement, dans un éditeur en fait. et je me suis un peu abimé les yeux quand même ! comment veux-tu que ça fonctionne ?! c'est un vrai b***del ! il faut que tu saches comment s'articule un document html sinon tu vas galérer à longueur de temps. allez hop, un p'tit tuto sur html ! et un aut' sur css ! ce ne sont que des introductions, c'est vite lu et ça pose pas mal de choses. voici une version arrangée de ton code. ça tourne à part que les images des pays ne sont pas à la place que tu as indiquée. la carte du monde s'affiche et réagit au survol.

carte du monde

mais il va falloir que tu revois sérieusement ton code parce que ça part vraiment dans tous les sens. (des balises ' à tout bout de champ, tu rechignes pas sur la dépense, lol !!! ) -:op je te fais confiance, dans quelques temps tu feras ça en trois copier/coller ! -;o)

Dalida · Answer

salut, tu peux le faire en html avec une simple image () et tracer des zones réactives avec .

caro777 · Answer

mais comment tu défini ces zones réactives...
il faut pouvoir selectionner le pays (roll over ou quelque chose du genre pr que l'utilisateur sache bien sur quel pays il va cliquer) et donc il s'agit d'image independantes et en html je ne vois pas comment on fait ca...

merci :-)

caro777 · Answer

j'ai été regarder le système mais il ne peut s'agir que de rectangle,cercle, poly..... comment fait on pour cliquer sur l'ensemble de la zone....est il possible de le faire sous html ou alors sous flash mais ou met on le code??

tte réponse est la bienvenue

Dalida · Answer

re,

désolé je cherchais depuis plus d'une demie heure une discussion à laquelle j'ai participé et où l'on a parlé de roll over sur une image mappée.

regarde cet exemple et dis nous si tu veux quelque chose comme çà.

Dalida · Answer

en fait, il y une carte nue qui est mappée. chacune des qu'elle contient réagit au survol de la souris par un JavaScript qui affiche la même carte mais avec le canton mis en évidence plus le texte d'affiché. donc une carte de fond + une carte par zone active, du JavaScript pour précharger toutes ces images et les afficher/masquer au survol. pour faire les si il y a beaucoup de zones ou si les zones ont des contours compliqués mieux vaut utiliser un logiciel, sinon tu vas galérer.

caro777 · Answer

ok je vois le pricipe mais concrêtement.......heu......pas du tt!!! 
mais j'ai des tonnes de questions à te poser....
voila il me faut ma carte de base mais ensuite comment fais-tu pr mapper la carte?? ce que je ne comprend pas c'est que ce systeme de map ne peut fonctionner qu'avec des formes geometriques?? 
comment faire pr le roll over car il s'agit bien d'une zone défini ....manuellement??? enfin je veux que c'est moi qui vais récupérer cette zone (photoshop?)???

c'est peut être pas trés clair car j'ai du mal à voir comment réaliser ce systéme de map....

peux tu m'expliquer quelles st les étapes à suivre, les programmes à utiliser (simple et detaillé ;-))....que je sache par ou commencer

merci bcp.... :-)

Dalida · Answer

tu récupères ta carte, ensuite tu utilises un logiciel qui te permets de dessiner les <area> à la main.

essaies Amaya, crée un document, insère une image puis XHTML/Plan/Ellipse.
tu vois comment ça tourne et on en reparle ?

caro777 · Answer

ca marche.... a + tard

caro777 · Answer

re,

alors je suis sur amaya, j'ai importé ma carte mais ensuite je ne vois pas comment on sélectionne une zone... qd je fais XHTML/Plan/cercle  il me met ' pas de position d'insertion definie. selectionner d'abord'

so, je peux avoir un indice..... :-) mais ou on selectionne???

merci

Dalida · Answer

salut,

pour importer ta carte tu as fait quoi ?

&bull; Fichier/Nouveau/Nouveau document XHTML&hellip; (tu indiques où le créer et tu donnes un titre)
&bull; XHTML/Image (tu indiques quelle image et tu donnes un texte 'alt')
&bull; XHTML/Plan/Cercle (le curseur est en croix, tu fais un cliqué/glissé sur l'image pour dessiner le cercle)

ne t'inquiète pas si ton <area> n'est pas au bon endroit ou pas de la bonne taille, tu pourra tout redéfinir ensuite, au pixel près.
pour cela affiche les attributs de l'objet &rarr; Vues/Montrer les outils

tu peux aussi regarder dans Aide/Zone Active.

caro777 · Answer

ok j'avais pas fait comme ca en fait....normal que ca ne marche pas :-) j'aurai du commencer par l'aide!!

sinon faut-il tjrs mettre 'alt' dans texte de remplacement qd on ouvre l'image et qd on fait une selection???

ensuite lorsque j'ai fais ma selection il me demande d'inserer l'URI, que faire???
ce que je ne comprends tjrs pas c'est qu'il s'agit d'une selection en cercle alors que le pays n'est pas une forme geometrique....
je croyais qu'on avait une baguette magique ou un outil de selction comme il y en a dans photoshop....

merci, a +

Dalida · Answer

"faut-il tjrs mettre 'alt' dans texte de remplacement qd on ouvre l'image et qd on fait une selection"
oui, pour que ton code soit valide.
tu dois mettre un texte qui sera affiché à la place de l'image si le fichier n'est pas trouvé ou si le navigateur de l'utilisateur n'affiche pas les images.

"il me demande d'insérer l'URI, que faire?"
tu vas utiliser Amaya uniquement pour faire la <map> donc tu peux te permettre de mettre une valeur farfelue, tu la remplacera après mais en le faisant proprement dès le départ ce sera toujours ça de fais&hellip;

quelle valeur mettre ? cela dépend de la façon dont tu organises ton site. en fait il faut mettre l'adresse de la page qui sera affichée quand l'utilisateur cliquera sur le lien.

tu devrais mettre dans l'URI quelque chose qui ressemble à :
 https://www.pagesjaunes.fr/" (l'adresse absolue de la page)
ou :
"pays/guatemala.html" (c'est l'adresse relative, plus pratique que l'adresse absolue).

"il s'agit d'une selection en cercle alors que le pays n'est pas une forme geometrique"
tu manques de curiosité !!!
essai avec XHTML/Plan/Polygone
tu cliques à chaque sommet de la figure que tu veux dessiner et tu double cliques pour fermer la figure.
par ailleurs, ce n'est pas grave si quelques pixels par ci par là ne sont pas exactement dans la zone, l'utilisateur avec sa souris n'atteint pas cette précision !

une fois que tu as fait toutes tes zones il faudra modifier le code source à la main pour ajouter le comportement en JavaScript.

caro777 · Answer

dacodac....merci

en fait je ne savais qu'on pouvais s'y prendre de cette manière....j'ai cru au départ qu'il fallait tracer direct un cercle ou un poly et qu'ensuite on prenait chauque point pr le déplacer... passons.....

maintenant que j'ai fais ma sélection j'ai une partie attributs dans laquelle s'affiche 
alt   alt
coords   140,21,140,39,148...bref c'est assez long car j'ai mis pas mal de point (burkina :-))
href www/pages/pro.bur.php/

j'ai fais une autre selection mais maintenant comment ca se passe pr la suite.....jsuis prête pr la suite des instructions :-)

Dalida · Answer

pour l'url il faut enlever 'www'.

pour la suite il faut que tu regardes le code source de la page que je t'ai montré comme exemple et faire pareil...

as-tu fais une carte pour chaque pays avec le pays d'une couleur différente ?
si non, il faut le faire.

ensuite il faudra ajouter le JavaScript de la page exemple à ta page "carte générale". puis ajouter l'évènement à chaque <area>.

moi je vais déjeuner, j'espère pour toi que quelqu'un prendra le relais !

Dalida · Answer

re,

un exemple qui te permettra de faire le reste, il n'y a qu'à afficher le code source et à s'en inspirer !

caro777 · Answer

c tt à fait ce qu'il me fallait....

merci ca va bcp m'aider mais j'ai tt d'abord une question....le roll-over tu le fais sous amaya??? et comment? tu crées une autre image?? tu remplis ta selection d'une couleur....bref concretement comment tu t'y prends??? ca peut paraitre un peu bête mais finalement la je suis concée!!!

gracias

caro777 · Answer

pr le roll over je ne connais pas du tt amaya....est ce que tu fais un remplacement d'image avec une autre image pas forcement crée sous amaya et que tu mets dans le même dossier à la racine du site...bref je ne sais pas...

Dalida · Answer

salut, le rectangle principal (jaune) est une balise '' associée à une carte de zones réactives (''), le comportement au survol est codé en Javascript. Carré jaune bordé de orange avec trois motifs tracés en trait orange : un cercle, un triangle et un rectangle.

Carré jaune bordé de orange avec trois motifs tracés en trait orange : un cercle, un triangle et un rectangle.

• 'id' : permet d'identifier de façon unique la balise dans le document html, sert pour le Javascript ; • 'alt' : texte qui sera affiché si l'image ne peut l'être (mauvaise url, bitmap déplacé ou supprimé, navigateur n'affichant pas les images) ; • 'src' : ulr du bitmap affiché. dans ce cas un 'png' nommé 'map_default.png' dans le dossier 'ressources' ; • 'width et 'height' : dimensions de la balise, doivent être égales aux dimensions du bitmap ; • 'usemap' : identifiant ('id') de la carte ('') à utiliser. […] la zone réactive à été codée avec Amaya (beaucoup plus rapide, qu'à la main). j'ai ajouté le comportement au survol du curseur. pour cela j'associe une fonction Javascript aux évènements html 'onmouseover' (quand le curseur survole la zone) et 'onmouseout' (quand le curseur quitte la zone). les autres attributs : • 'shape' : la forme de la zone ; • 'coords' : les coordonnées de la zone ; • 'alt' : idem que pour ; • 'href' : la cible affichée au clic. le Javascript, d'abord je définis un tableau contenant les url des fichiers bitmap, ensuite je précharge les images pour éviter une latence au premier survol due au temps de téléchargement du fichier. en fait, on met toutes les images dans le 'cache' du navigateur. if (document.images) { preload = false; url = new Array(); url[0] = "ressources/map_default.png"; url[1] = "ressources/map_circle.png"; url[2] = "ressources/map_poly.png"; url[3] = "ressources/map_rect.png"; var i = 0; for(i=0; i<4; i++) { tmp = new Image(640, 480) tmp.src = url[i]; } preload = true; } } enfin la fonction qui va changer la valeur de l'attribut 'src' de notre balise . le changement se fait instantanément. function changeImage(img_index) { if (document.images && (preload == true)) { document.plan.src = url[img_index]; } } dans chaque '' j'exécute à l'entrée du curseur le changement vers le bitmap survolé, à la sorti j'exécute le changement vers l'image par défaut. pour les images, il y a l'image par défaut et une image (identique hormis une mise en valeur avec de la couleur) pour chaque forme. les cibles des liens sont des fichiers html bateaux où j'ai mis un bitmap représentant chaque forme pour que l'on puisse les différencier mais cela pourrait être n'importe quoi d'autre. donc Amaya m'a servi pour définir les coordonnées des . le reste est fait avec un éditeur de texte. voili, voila ! tu n'as plus qu'à… -;o) bon courage !

caro777 · Answer

aie!!!! c bien compliqué tt ca....mais bon j'ai mis le code sur ma page avec la carte du monde et effectivement lorsque je survol la zone définie mon curseur change...c donc ma zone active jusqu'ici tt va bien.... par contre le code "if..." tu le mets dans des balises n'est ce pas??? je ne connais pas le javascript...et tu mets le code ou tu veux dans ta page?? ensuite lorsque je clique sur ma zone je ne me rends pas à la page souhaitée mais j'ai : Fatal error:call to undefined function: traduction() in c:\program files\easyphp1-7 \www\www\pages\pro.bur.center.php on line 9 en effet a cette page j'ai une fonction traduction pr le titre car c un site multilingue mais qu'est ce que ca vient faire la dedans??? merci en tt cas pr tte ces explications...ca m'aide bcp et ca simplifie nettement la chose!!! a bientôt

Dalida · Answer

pour le Javascript, il faut le mettre dans le '<head>' dans une balise ou avec un lien vers un fichier externe.
pour l'implémentation regarde cet article.

pour savoir comment ça fonctionne, regarde le code source de mon exemple.

(vraiment pas curieuse décidément !) -:op

pour le php, l'erreur doit être sur l'autre page mais il vaut mieux qu'on voit ça plus tard !
-;o)

caro777 · Answer

hum....pas curieuse!!! et comment est ce que j'en suis arrivée là??? C'est la curiosité qui fait qu'aujourd'hui je peux travailler sur une site internet sans m'arracher les cheveux....en fait il y a tellemet d'infos sur le net que j'ai du mal à m'y retrouver alors je préfere te poser ces questions même si elles peuvent te paraitre un peu bêtes...c tjrs comme ca qd on est débutant.....

en tt cas merci de m'aider....je t'avoue que sinon j'aurai été obligé de laisser tomber même si c pas mon genre....ne surtt pas laisser la machine prendre le pas sur l'homme, il y a tjrs une solution!!!

a +

Dalida · Answer

"ne surtt pas laisser la machine prendre le pas sur l'homme"
+1
tu as bien raison !!!
et si je tire la langue -:op : c'est que c'est uniquement pour te chambrer !

tu as l'air combattive et c'est tout à ton honneur.

à bientôt j'espère, pour un coup de main ou pour venir nous aider à répondre !
ou pour nous montrer ce que ça donne !

caro777 · Answer

"ne surtt pas laisser la machine prendre le pas sur l'homme" 
je tiens ca d'un d'un de mes profs que j'adore .... c pas le genre à se laisser abattre et je dois dire que c'est lui qui m'a, sans trop le savoir, poussé pr aller jusqu'au de mes projets...

ceci étant dit je n'arrive pas à résoudre ce pbl de 'fatal error' mais j'ai 2/3 indices: 
- mes pages sont composées de 3 parties (gauche, centre, droite)
- j'ai un fichier pr chaque partie et un fichier qui les rassemble avec une série de 'includes'...

bref si je fais le lien avec ce fichier qui contient les 'includes' il met automatiquemet une erreur pr la ligne qui contient la premiere include..

si je fais le lien avec le centre de la page il met le message d'erreur:
Fatal error:call to undefined function:
traduction() in c:\program files\easyphp1-7
\www\www\pages\pro.bur.center.php on line 9 

mais cela fonctionne pr une de mes pages qui n'utilise pas ma fonction traduction... so je pense qu'on ne peux pas faire le lien vers une pages qui contient une fonction, is it true??

 a+


ps. si je peux apporter mon aide je le ferai....même si mes compétences st assez limitées.... :-)

Dalida · Answer

salut,

peux-tu nous montrer le code de 'c:\program files\easyphp1-7
\www\www\pages\pro.bur.center.php' ?

caro777 · Answer

hum....il faut que tu saches une chose c'est que si je me rends à la page pro.bur.center.php je n'ai pas le reste de ma page alors le mieux aurait été de me rendre à pro.bur.php mais est ce possible??? code pro.bur.center.php///////////////////////////////////////////////////////////////////

code pro.bur.php////////////////////////////////////////////////////////////// gracias

Dalida · Answer

mais elle est définie où la fonction 'traduction()' ?

il faut qu'elle apparaissent dans le code avant d'être appelée, en général avec 'require_once(fichier_contenant_la_fonction.php)' au début du script.

caro777 · Answer

c'est une trés bonne question....hum alors en fait nous avons à la base un fichier index.php ensuite mon fichier util_trad.php est assez conséquent mais je le met qd même... je t'avoue que cette histoire de langues me laisse assez perplexe...et je ne vois pas comment contourner le pbl.... ? function getURL($S) { global $current_language; echo "index.php?page=$S&lang=$current_language"; } function toURL($S) { global $current_language; return "index.php?page=$S&lang=$current_language"; } function getTraduction($f, $word, $language, $sep){ for ($i=0; $i < count($f); $i++) { if (strpos(" " . $f[$i],$word . $sep . $language) == 1) { $pre = (strpos($f[$i],"no_compile") > 0); $res = ""; for ($j = $i+1; (($j < count($f)) && (strpos(" " . $f[$j],"}") == 0)); $j++ ) { if ($pre) { if (strpos(" " . $f[$j],"##") > 0) { $sub = substr($f[$j],strpos($f[$j],"##") + 2); if (strpos(" " . $sub,"##") > 0) { $sub = substr($sub,0,strpos($sub,"##")); $f[$j] = str_replace("##".$sub."##", toURL($sub), $f[$j]); } } } $res .= $f[$j] ; } if (! $pre) { $res = htmlentities($res); $res = str_replace(" ","
",$res); } else { $res = str_replace(" ","",$res); } return $res; } } return NULL; } function getTraductionWithoutPre($f, $word, $language, $sep){ for ($i=0; $i < count($f); $i++) { if (strpos(" " . $f[$i],$word . $sep . $language) == 1) { $res = ""; for ($j = $i+1; (($j < count($f)) && (strpos(" " . $f[$j],"}") == 0)); $j++ ) { $res .= $f[$j] ; } return $res; } } return NULL; } function hasParadigm($f, $word, $param){ global $current_language; $f .= ".lang"; if (file_exists($f)) { $f = file($f); $pref = parse_ini_file("../index.ini",true); $sep = $pref['pages']['separator']; for ($i=0; $i < count($f); $i++) { if (strpos(" " . $f[$i],$word . $sep . $current_language) == 1) { return (strpos($f[$i],$param) > 0); } } } return false; } function traduction($word, $f){ global $current_language; $f .= ".lang"; $f = file($f); $pref = parse_ini_file("index.ini",true); $separator = $pref['pages']['separator']; $default = $pref['languages']['default_language']; if (getTraduction($f, $word, $current_language, $separator) != NULL) { echo getTraduction($f, $word, $current_language, $separator); return 1; } else { echo getTraduction($f, $word, $default, $separator); return 0; } //$HTTP_ACCEPT_LANGUAGE } function getTradAdmin($word, $f){ global $current_language; $f .= ".lang"; if (file_exists($f)) { $f = file($f); $pref = parse_ini_file("../index.ini",true); $separator = $pref['pages']['separator']; $default = $pref['languages']['default_language']; if (getTraduction($f, $word, $current_language, $separator) != NULL) { return getTraductionWithoutPre($f, $word, $current_language, $separator); } else { return -1; } } return -1; //$HTTP_ACCEPT_LANGUAGE } function getSomAdmin($word, $f){ global $current_language; $f .= ".som"; if (file_exists($f)) { $som = parse_ini_file($f, false); $pref = parse_ini_file("../index.ini",true); $separator = $pref['pages']['separator']; $cur = $word . $separator . $current_language; if (isset($som["$cur"])) return $som["$cur"]; else return -1; } return -1; } ?> a tte

Dalida · Answer

au lieu de :
include("src/util_trad.php"); 
essaies avec :
require_once("src/util_trad.php"); 
require_once()

caro777 · Answer

en fait non mais je ne suis pas sure d'avoir mis le script comme il faut....le truc c que je ne sais pas quelle est la différence entre les éléments du script et les événements javascript....est ce que ca doit être quelque chose du style: sinon g tjrs fatal error mais faudrait il changer tt les 'includes' en require_once??? thanks

Dalida · Answer

as-tu vu la différence entre les deux ?
'include()' interprète le code, 'require()' l'insère

dans le premier cas, il ne renvoie rien puisqu'au moment de l''include()' la fonction n'a pas encore été appelée et au moment de l'appel la fonction n'est plus disponible.
dans le deuxième, c'est l'équivalant d'un copier/coller. donc le code de la fonction est au début et il est disponible plus bas.

pour l'erreur, est-ce exactement la même ?

pour le remplacement de tous les 'include()', il faut voir au cas par cas.

caro777 · Answer

ok....en fait lorsque je me rend a pro.bur.php j'ai une erreur à cause de la suite des includes (que j'ai naivement essayé de remplacer par des require_once) sinon pr pro.bur.center.php g tjrs une fatal error au niveau de ma fonction traduction: définie dans le fichier util_trad.php donc ailleurs (mentionné dans index.php donc ailleurs) en fait j'avais compris le fonctionnement des require_once, ce que je comprend moins c ou mettre le script ;-) différence entre éléments du script et évenements javascript.... en plus le code ' mais la suite de mon code est bleu donc plus de distinction entre balises est ce normal ou g fais une erreur....?

Dalida · Answer

pour savoir ou mettre le script : où il est nécessaire… pour les les 'include()' et consorts mieux les mettre au tout début. par contre il vaut mieux utiliser "' pour php, c'set le serveur qui les différencie pas le navigateur. pour '' si tu codes en HTML il faut coder '', moi j'étais en XHTML donc ''… pour ton script php c'est compliqué. car je ne vois pas le problème dans son intégralité et qu'il a pas mal d'inclusion.

caro777 · Answer

snif....g plus l'impression de voir le bout du tunnel... :-(

en fait pr ce pbl de fonction traduction est ce qu'il faut mettre <? php require_once ("src/util_trad.php"); ?> dans la page pro.bur.center.php???

je suis à court de questions, d'idées et d'enthousiasme....

caro777 · Answer

hello,

finalement après moultes recherches j'ai finalement réussi à faire le lien avec mon autre page....
cependant j'ai encore une question à te poser et aprés je crois que je v bondir de joie car ce sera enfin terminé:

alors voila, j'ai ma carte avec tt mes liens et tt fonctionne c super!! mais je n'ai pas réussi à faire le roll over, tu as mis:

onmouseover="changeImage(1); return false;"
onmouseout="changeImage(0); return false;" />

en fait pr chaque zone doit correspondre une autre carte avec le pays choisi d'une autre couleur donc une carte différente  pr chaque pays mais ou places-tu cette image, comment la nommes-tu???

a +
thanks

Dalida · Answer

salut,

j'ai placé toutes les images dans le même dossier, histoire que ce soit plus pratique. je l'ai appelé 'ressources'.
pour le nom des images, à toi de voir !

la correspondance avec le Javascript se fait là :
	url = new Array();
	url[0] = "ressources/map_default.png";
	url[1] = "ressources/map_circle.png";
	url[2] = "ressources/map_poly.png";
	url[3] = "ressources/map_rect.png";
les url des images sont stockées dans un tableau qui servira d'abord au preload, puis à l'affichage.
c'est cette partie qu'il faut que tu modifies avec tes valeurs.

caro777 · Answer

hello, ca faisait lgt...g été un peu occupée ailleurs ces derniers temps....tt fonctionne et tte les zones st faites, ca c vraiment génial!! BUT le rollover ne fonctionne pas....je t'explique comment je fais...dis moi si ya une erreur... url[0] = "images/projets/monde.gif"; url[1] = "images/projets/bresil.gif"; // même image avec le pays concerné d'une autre couleur url[2] = "images/projets/haiti.gif"; url[3] = "images/projets/burkina.gif"; .... pkoi nommer les images map_circle, map_rect...?? thanks

Dalida · Answer

salut,

bravo tout semble bon !
il faut vérifier les url elles peuvent être fausses.
et sur la boucle en dessous du tableau d'url, as-tu pensé à modifier le chiffre maxi de la boucle (= dernier index du tableau + 1) ?

"pkoi nommer les images map_circle, map_rect...?? "
c'était ma convention de nommage. "map_" + le nom de la forme.
c'est pour m'y retrouver plus facilement c'est tout.

caro777 · Answer

Non....c pas ca, à ce niveau là tt est en ordre!!!
Dans ton exemple, tu as 2 "map name", why??
De plus a quoi sert le fichier img_map.txt???

a presto

Dalida · Answer

"tu as 2 "map name"" là je vois pas du tout de quoi tu parles… as-tu remarqué que pendant le week end j'ai ajouté un 2eme exemple pour un autre ccmiste ? "a quoi sert le fichier img_map.txt??? " il sert juste à afficher le script sur la page html. pour une question de validité du code il est plus simple de le faire comme ça. mais ça ne concerne pas du tout ton code. peux-tu me copier/coller le code JS entier plus tes codes '' et '' ? ou me donner une url. et pour vérifier si les adresses sont exactes, code l'adresse en entier (depuis 'http' jusqu'à 'jpg').

caro777 · Answer

voila pr le code thanks

Dalida · Answer

hum, hum… function changeImage(img.index) { if (document.images && (preload = = true)) { document.plan.src = url[img_index]; } } la variable du paramètre de la fonction n'est pas la même que la variable utilisée comme index du tableau d'url et on ne sépare pas les deux '='. function changeImage(img_index) { if (document.images && (preload == true)) { document.plan.src = url[img_index]; } } pour encadrer le script, mieux vaut être en minuscules et utiliser ça : essaie avec tout ça et on approfondit si c'est pas encore ça !

caro777 · Answer

ouille, j'avais laisser passer ca...tt les détails comptent mais :-( non c pas ca.....
ya rien qui se produit....

Dalida · Answer

hum, hum (bis)…

si l'image n'as pas d'identifiant comment JS va le reconnaitre ?…

caro777 · Answer

:$ heu...t'as raison mais hélas il ne se passe tjrs rien!! quest ce que j'aurai pu oublier?? dis moi tt même ce qui peut te sembler basique!! C'est trop bête si près du but!!! :-(

thanks

ps: ya t'il un "hum hum bis2???" I hope ;-)

Dalida · Answer

salut,

des touches de ton clavier ne fonctionnent plus ?
-:op

hum, hum (ter)&hellip;
-;o)

en JS, fils de C, il faut un point virgule au bout de chaque instruction.
j'en profite pour te recoller le script en entier, j'espère qu'il comporte toutes les corrections précédentes.
if(document.images)
{

	preload = false;
	url = new Array();
	url[0] = "images/projets/monde.gif";
	url[1] = "images/projets/bolivie.gif";
	url[2] = "images/projets/bresil.gif";
	url[3] = "images/projets/burkina.gif";
	url[4] = "images/projets/colombie.gif";
	url[5] = "images/projets/haiti.gif";
	url[6] = "images/projets/inde.gif";
	url[7] = "images/projets/madagascar.gif";
	url[8] = "images/projets/mali.gif";
	url[9] = "images/projets/perou.gif";
	url[10] = "images/projets/senegal.gif";
	url[11] = "images/projets/uruguay.gif";


	var i = 0;
	for(i=0; i<12; i++)
	{
		tmp = new Image(640, 480);
		tmp.src = url[i];
	}
	
	preload = true;
	
}

function changeImage(img_index) {

	if (document.images && (preload == true)) {
		document.plan.src = url[img_index];
	}
	
}
pour déboguer, le plus simple est de se faire aider par un débogueur&hellip;
sur FF, ajoute l'extension FireBug, elle te permettra de voir où le code bloque. moi, je ne peux pas le faire car je n'ai pas accès à ta page.

courage !!!

caro777 · Answer

re,

merci pr FireBug, ca doit être intéresant qd on sait exactement comment s'en servir...je l'ai installé et pis je sais pas trop pr les scripts comment faut faire mais il me met en tt cas:

map name illegal XML character
2 <html> 3 <h missing ; before statement

interessant??
bon je vais manger et aprés je m'y remet

a +

Dalida · Answer

oula,
sans doute un problème de validité html&hellip;

pour ça il faut que nous colle le code de la page entière !

caro777 · Answer

ok alors voila mon code si tu penses que l'erreur est là dedans... thanks

Dalida · Answer

hum, hum (quater)… -:oD tu fermes '' avant de fermer ''. et à la place de '' colle ça (DocType Definition) :

caro777 · Answer

on peux fêter notre 50ème message!!! ;-)

j'en ai parcouru du chemin depuis alors merci à toi de me faire partager tes compétences en la matiére et de prendre le temps pour m'expliquer tout ca...

sinon ca fonctionne toujours pas....:-(
tu m'as bien demandé de rammener le body en bas de page juste avant table et je garde le <html> de fin de page....mais je remplace juste le 1er?? alors dans ce cas rien ne bouge...j'ai peur que le probléme soir plus grave...
même déprime qu'au message 34....

thanks

caro777 · Answer

hello, bon pour le café virtuel, promis, j'y passe début de semaine prochaine..mais sinon je te propose même un vrai café.....on en reparlera :-) sinon un grand merci pour les liens....ca m'a permis de résoudre un probléme...en effet certaines parties de mon texte doivent être centrées et d'autres alignées à gauche alors j'ai découvert qu'on pouvait utiliser la "class" avec la balise

et donc ca donne dans la css p.justify{.....text-align:justify} p.left{.....text-align:left} dans le code

c'est nikel....d'ailleurs ya plein de choses intéressantes au niveau du tutoriel xhtml....hélas j'ai pas beaucoup de temps devant moi pour l'instant... En plus je travaille sur un site concu par une autre personne et ya pas mal de petites choses incohérentes....je ne m'y connais pas beaucoup mais lorsque j'ai essayé parfois de mettre un peu d'ordre ma page était toute déstructurée.....dur dur au début!!! sinon je ne comprends pas, tu as testé??? j'ai utilisé ton code pour ma page projet et le roll over ne pointe toujours pas le bout de son nez....!!! rrrrr..... alors si l'erreur n'est pas dans le code ou est elle?? thanks, a presto,

Dalida · Answer

salut,

pour les classes, bien vu !
je te mets juste en garde sur le choix des noms choisis.
je me suis permis d'utiliser "left" tout court ce qui peut être un peu déstabilisant pour un débutant à la lecture du code puisqu'on peut le confondre avec une propriété. j'aurais peut être mieux fait de choisir "align-left". bref, c'est du détail !

"tu as testé???"
et oui, comme je connais l'adresse réelle du serveur il me suffisait de faire une page avec ton code et de remplacer l'adresse relative des images par l'adresse absolue.
-;o)

qu'as-tu fais exactement comme essais ?
pour ma part, j'avais réussi à afficher la carte. elle était réactive sur trois ou quatre pays (en Amérique Latine). et sur un pays l'image était effectivement remplacée, mais par du vide car l'image n'était pas à l'adresse indiquée sur le serveur. peut être n'as-tu pas encore "uploadé" les images sur le serveur.

donc le code que je t'ai collé plus haut fonctionne. il faut maintenant faire les ajustements pour savoir pourquoi il ne fonctionne que partiellement.

à plus !

caro777 · Answer

hello,

en fait je travaille en local sur une autre machine sur laquelle je n'ai pas internet donc ttes mes images sont uniquement sur mon ordinateur voila pourquoi il y a du vide à la place des images j'imagine...

sinon pourquoi est ce que cela fonctionne de ton côté mais pas du mien....??? :-(

Dalida · Answer

as-tu utilisé mon code ?

caro777 · Answer

bien sur!!!! ;-)

copier/coller

et je viens de le refaire...au cas ou je deviendrais folle....

Dalida · Answer

et l'actualisation de la page avec [ Ctrl ] + [ F5 ] ???

caro777 · Answer

lol, c'est pas ca

Sur quels pays ca fonctionne ??? même si je les ai tous testé....

Dalida · Answer

Colombie, Pérou, Bolivie&hellip;
en ligne

caro777 · Answer

It's impossible!!!
pourquoi est ce que ca marche avec toi et pas chez moi.....as tu une idée de ce qui ne fonctionne pas???? jsuis désemparée!!!!
ca fonctionne mais pas CHEZ MOI!!!  :-(  :-(  :-(  :-(

thanks

Dalida · Answer

la carte du monde s'affiche ?

caro777 · Answer

yes!!!

Dalida · Answer

et pas de réaction au survol ?
mais qu'as-tu fais ???
-:op

caro777 · Answer

salut a tous,

cela fonctionne pour l'instant sous firefox mais pour que cela fonctionne aussi sous internet explorer il faut modifier une partie du script:

à la place de:
 
function changeImage(img_index) {

if (document.images && (preload == true)) {
document.plan.src = url[img_index];
}

}

il faut mettre

function changeImage(img_index) {

if (document.images && (preload == true)) {
document.getElementById("plan").src = url[img_index];
}

}

et voila tout fonctionne

encore un grand merci à Mathieu alias Dalida pour son aide

Aurélien · Answer

Bonjour, 
Je n'arrive pas à faire des rectangles à chaque fois le coin haute-gauche du rectangle se met en haut-gauche de l'image.

Map monde avec liens sur pays - Page 4

Discussions similaires

Newsletters