Mes roll-over ne fonctionnent pas!Résolu/Fermé

Question

Bonjour, 
J'ai créé sous Image Ready une carte géographique qui fait apparaitre différentes informations quand on survole chaque zone.Il y a une vingtaine de zones différentes à survoler, et donc j'ai créé autant de cartes-images avec leur état de survol propre. 
Quand je fais un aperçu dans mon navigateur à partir d'image ready, aucun problème, mes roll-over s'affichent très bien. 
J'ai donc enregistré l'ensemble des images de mon fichier dans le dossier de mon site internet, et j'ai copié le code généré par Image Ready dans celui de ma page web. Mais quand je navigue sur mon site, ou même quand je le teste en local, problème : les roll-over n'apparaissent plus. 
J'ai donc mon image de base qui s'affiche correctement, mes liens fonctionnent quand je clique sur chaque zone, mais quand je survole, rien ne se passe. 
Je ne comprend pas d'où peut venir le problème. Pouvez-vous m'aider svp? Merci d'avance.

Edouard · Answer

Je ne connais pas image ready, donc pas le code qu'il génère et sa qualité intrinseque.

Donnes nous le code de ta page.

maudus · Answer

Bonjour, voici mon code : Code du preload dans le head : Code dans le body : Carte des cantons de Meurthe et Moselle

king · Answer

même les "/www/" dirais-je.

maudus · Answer

c'est ce que je viens de faire mais aucun changement!

Dalida · Answer

salut,

je n'y connais pas grand chose en js mais ta fonction changeImage() je la verrais plutôt  comme ça :
function changeImages(target, img_source) {
	if (document.images && (preloadFlag == true)) {
		document[target].src = img_source;
	}
}

c'est plus clair que la boucle for

maudus · Answer

salut,

j'ai remplacé mon code changeImages par celui que tu m'as donné mais toujours aucun changement...

Edouard · Answer

Salut,
si tu veux je peux te filer les fonctions js de dreamwaver, mais va falloir sûrement tout reprendre.
Les roll-over, ils fonctionnent en local ?

maudus · Answer

ils fonctionnent quand je fais un aperçu dans le navigateur via image ready, mais pas dans mon site, ni en local, ni en ligne

maudus · Answer

plus personne pour m'aider? Up svp c'est important pour moi et je galère depuis 2 mois là-dessus...

Dalida · Answer

salut,

c'est quoi l'url ?

maudus · Answer

Le problème est que je ne préfère pas donner l'url sur le forum pour le moment car il est juste en ligne pour que je le finalise mais je ne veux pas le sortir "officiellement" pour le moment (en raison de la legislation dans ce domaine)

Dalida · Answer

sur les deux ou trois premières zones essaie en ne mettant que le onMouseOver et vire le reste pour voir si ça vient de lui ou d'une combinaison avec un autre.

Dalida · Answer

à quoi sert le 'return true;' ?
peux-tu essayer juste avec çà s'il te plait :
<area onMouseOver="changeImages('carte_gerenale_01', 'images/carte_gerenale_01-Carte--20.gif');" href="http://www.54agauche.fr/longwy.php" coords="81,25,91,37" alt="" shape="rect"/>

maudus · Answer

J'ai essayé ce que tu m'as dit, pas de changement! Je désespère...

Dalida · Answer

donc ça vient surement de ta fonction, tu progresses !
essaies d'isoler morceau par morceau et de valider à chaque fois ce qui fonctionne.

tu aurais sans doute aussi vite de te coder une page à coté avec le même comportement mais dans une page dépouillée et en ne prenant qu'une image. d'ici la débauche suis sûr que tu trouveras !

courage !

maudus · Answer

juste pr info le code que tu m'as donné au-dessus ne fonctionne pas non plus

Dalida · Answer

tu peux encore essayer comme çà :
<area onMouseOver="javascript:changeImages('carte_gerenale_01', 'images/carte_gerenale_01-Carte--20.gif');" href="http://www.54agauche.fr/longwy.php" coords="81,25,91,37" alt="" shape="rect"/>

maudus · Answer

Non ca ne fonctionne pas non plus
Mais tu vois ce qui m'énerve le plus c'est que j'ai utilisé le même logiciel (image ready) pour coder d'autres roll-over qui forment les boutons du menu de mon site.
Ces boutons sont donc codés de la même façon, sauf qu'ils n'ont qu'une seule zone réactive, contre une quarantaine pour le fichier qui m'intéresse.

Et ces boutons fonctionnent parfaitement!

Je vais péter un plomb!

Dalida · Answer

et ce ne serait le quantité justement ?
je serais toi je reprendrai un fichier html vide, je mettrai la carte et je testerai avec une seul zone.
si ça marche tu ajoute les zones une à une.

maudus · Answer

Alors en fait je viens de copier mon code généré par image ready dans une page html entièrement vide et là mes roll-over fonctionnent parfaitement (avec toutes les zones réactives en même temps)
Qu'est-ce que cela veut dire à ton avis?

Dalida · Answer

ça veut dire que tu es sur la bonne piste !!!
il faut chercher les erreurs de code ou peut être une balise mal fermée.
c'est logique parce que en ligne Firebug ne trouvait pas d'erreur de JS.
fais l'inverse : une version ou tu fais sauter tout le JS et essais de la faire valider (en espérant que ton code soit pas trop crade) ça te montrera peut être des erreurs html.

je viens de le faire sur la version en ligne, 14 erreurs de html : c'est pas beaucoup ! si tu oublies les 'alt' pas renseignés ça fait beaucoup moins, ça doit être nettoyable.

maudus · Answer

OK je vois ça demain car je dois partir en réunion et je te tiens au courant
merci pour ton aide et ta patience

maudus · Answer

Alors voilà ce que j'ai fait : 
J'ai gardé ma page html vierge avec seulement le code de ma carte où les roll-over fonctionnent, et j'ai ajouté petit à petit les éléments pour arriver à la page web que je souhaite, en vérifiant régulièrement si mes roll-overs fonctionnent toujours au fur et à mesure des éléments ajoutés.
Et dès que j'ajoute le code pour les boutons de mon menu de navigation (qui fonctionnent également en roll-over), ceux de ma carte ne fonctionnent plus!
Est-ce que ca peut venir d'un problème de confrontation entre mes deux fichiers de roll-overs? A t'on la possibilité de faire cohabiter des élements différents fonctionnant avec des roll-over dans la même page web?
C'est vraiment la merde là!

Dalida · Answer

salut, mais non c'est pas la merde, c'est le contraire : tu as isolé le problème, reste plus qu'à le résoudre ! y aurait-il un conflit de nom ? est-ce que la fonction pour la carte et pour le menu sont faisable en une seule ou pas. j'arrive pas à dire ce que à quoi je pense ! je vais regarder tout à l'heure. pourquoi as-tu deux fonctions différentes ? tu ne peux pas le faire avec une seule ?

Edouard · Answer

+1 pour mathieu,
ça vient soit du nom des tes area ou map, soit de tes fonctions (au pire tu double toutes des fonctions js par copier coller et tu rajoute 1 dans le nom puis tu fais que chaque carte appelle une fonction différente histoire de mieux cerner ton pb).
Edouard

maudus · Answer

Ben j'ai une fonction pour les roll-over de mon menu, qui se retrouvent sur toutes les pages du site, et une fonction de roll-over pour ma carte qui ne se trouve que dans une page bien spécifique du site
et je vois pas comment faire une seule fonction je commence sérieusement à ma mélanger les pinceaux là!

Edouard · Answer

Balance le code

maudus · Answer

le code est plus haut

Dalida · Answer

c est le même qu'en <2>.

maudus · Answer

Effectivement c'est un peu délicat mais si tu suis le code tu peux arriver à la page concernée et obtenir le code source sans problème

maudus · Answer

Si c'est pour balancer des remarques comme ca c'est pas la peine je viens pas ici pour demander les avis politiques de chacun c'est vraiment pas mon problème et je viens encore moins pour faire un débat si tu veux exprimer ta couleur politique tu va voter dimanche point barre.
Le code tu peux l'avoir par le code source de la page, je me trompe?

Edouard · Answer

C'était ironique les gars... zen !
Pour l'url le truc c'est d'être sûr de parler de la même page et j'ai pas trop le temps de faire tout le tour du site pour ma'assurer qu'il n'y a qu'une seule carte...
C'est celle du département ?
Merci de confirmer.

Dalida · Answer

on en parle plus ! -;o) pour le code, il y a une map pour la carte mais pour le menu c'est chaque qui a une image de fond. donc pas de conflit entre .

Edouard · Answer

C'est sûrement pas le pb, mais deux balises body c'est pas top.
Je continue.

Dalida · Answer

oulala oui !!! j'avais même pas regardé le html, me concentrant sur les fonctions JS qui sont bien compliquées par rapport à ce qu'elles font… mais commence par enlever le double moi je parierai que c'est ça !!! ça doit donner ça pour le faire en une seule fois :

Edouard · Answer

Visiblement tu as dreamwaver, pourquoi tu n'a pas fait la carte dans ce même logiciel.
Refais la carte sur une page ou tu as le menu, au moins pour le premier polygone, tes si ça marche et ensuite tu récupère le bon code js pour les autres polygones.

maudus · Answer

ouah super ca marche enfin!!!!
J'ai fait ce que tu m'as dit Mathieu et ca a marché, effectivement il y avait 1 body en trop ce qui posait problème! Et dire que ca fait 2 mois que je me prend la tête la dessus et que c'était aussi simple, décidement j'ai vraiment pas l'âme d'une "codeuse"!

en tout cas merci bcp pour ton aide et merci aussi à edouard pour ses suggestions je suis soulagée vous pouvez pas savoir!

Edouard · Answer

Cool, sans rancune j'espère.
Pense aussi au métatag qui se balade.

maudus · Answer

Sans rancune ya pas de souci, je regarderais pour les métatags merci

Dalida · Answer

bravo à toi !
bravo aussi à Edouard qui a trouvé l'erreur en deux temps, trois mouvements !

pour info, chez moi (winXp sp2) ça passe sous FF 2, Opera 9, IE 6 & 7.
tu peux être fière de toi tu as déjà abattu un boulot d'un niveau plus que correct.

si tu as le temps et l'envie, penche toi sur Javascript et le DOM, tu arriveras vite à faire la même chose mais avec un code surement plus simple.

pour le html, le mieux est encore de faire des pages valides aux recommandations du W3C, ça permet d'avoir une structure de document ultra clean, même si ça ne résout pas tout  ça permet d'être sûr des fondamentaux !

après reste plus qu'à espérer que tu laches Dream pour coder avec un éditeur de texte ! lol
-;o)

bon courage pour la suite !

Mes roll-over ne fonctionnent pas!

40 réponses

Discussions similaires

Newsletters