Probléme map, firefox >> IE
Résolu/Fermé
A voir également:
- Probléme map, firefox >> IE
- Google map satellite gratuit - Guide
- Comment supprimer bing de firefox - Guide
- Video downloadhelper firefox - Télécharger - Outils pour navigateurs
- Telecharger carte google map - Guide
- Itinéraire google map entre deux adresses - Guide
9 réponses
Firefox ne digère pas l'atribut ID dans la balise <map id="...">
Il faut écrire <map name="..."> et ça marche dans les 2 navigateurs
Il faut écrire <map name="..."> et ça marche dans les 2 navigateurs
bonjour
j'ai un peu le même probleme
sauf que la balise id est dans la définition des div
et je ne sais pas par quoi le remplacer
si vous avez une solution je suis preneur
mon site est déjà en ligne : http://Tet-Zen /perso.orange.fr
le type de code a remplacer est :
<div id="ligneE2" style="background-image:Url(.\images\corbelin1.gif); width:35%; height:160px; position:absolute; left:350px; top:266px; z-index:3; visibility:hidden;">
<table cellpadding="0" cellspacing="0" width=280px>
<td align="center"><b>Les "Têt Zen à ???????"<br></b><b>XX juin 2009</b></b></td><tr>
<tr>
<td ><b>répertoire :</b>
<pre >
à definir ;
</pre>
...
<img src="./manifestations1.JPG"alt="calendrier de gauche" width="319" height="412" border="1" usemap="#ImageMap1"></img>
<!/p>
</td>
<!/table>
<!p> </p>
<!p> </p>
<map name="ImageMap1">
<area shape="poly" coords="2, 2, 317, 2, 317, 82, 2, 82" OnMouseOver="na_object_show('ligneA');na_object_hide('ligneB');na_object_hide('ligneC');na_object_hide('ligneD');na_object_hide('ligneE');na_object_hide('ligneF');na_object_hide('ligneF2');na_object_hide('ligneA2');na_object_hide('ligneC2');na_object_hide('ligneD2');na_object_hide('ligneE2');na_object_hide('ligneB2');">
<area shape="poly" coords="2, 84, 317, 84,317,164,2,164" OnMouseOver="na_object_show('ligneB');na_object_hide('ligneA');na_object_hide('ligneC');na_object_hide('ligneD');na_object_hide('ligneE');na_object_hide('ligneF');na_object_hide('ligneF2');na_object_hide('ligneA2');na_object_hide('ligneC2');na_object_hide('ligneD2');na_object_hide('ligneE2');na_object_hide('ligneB2');">
<area shape="poly" coords="2, 166, 317, 166, 317, 246, 2, 246" OnMouseOver="na_object_show('ligneC');na_object_hide('ligneA');na_object_hide('ligneB');na_object_hide('ligneD');na_object_hide('ligneE');na_object_hide('ligneF');na_object_hide('ligneF2');na_object_hide('ligneA2');na_object_hide('ligneC2');na_object_hide('ligneD2');na_object_hide('ligneE2');na_object_hide('ligneB2');">
<area shape="poly" coords="2, 248, 317, 248, 317, 328, 2, 328" OnMouseOver="na_object_show('ligneD');na_object_hide('ligneB');na_object_hide('ligneC');na_object_hide('ligneA');na_object_hide('ligneE');na_object_hide('ligneF');na_object_hide('ligneF2');na_object_hide('ligneA2');na_object_hide('ligneC2');na_object_hide('ligneD2');na_object_hide('ligneE2');na_object_hide('ligneB2');">
d'avance merci pour vos aides
amicalement Pierre
j'ai un peu le même probleme
sauf que la balise id est dans la définition des div
et je ne sais pas par quoi le remplacer
si vous avez une solution je suis preneur
mon site est déjà en ligne : http://Tet-Zen /perso.orange.fr
le type de code a remplacer est :
<div id="ligneE2" style="background-image:Url(.\images\corbelin1.gif); width:35%; height:160px; position:absolute; left:350px; top:266px; z-index:3; visibility:hidden;">
<table cellpadding="0" cellspacing="0" width=280px>
<td align="center"><b>Les "Têt Zen à ???????"<br></b><b>XX juin 2009</b></b></td><tr>
<tr>
<td ><b>répertoire :</b>
<pre >
à definir ;
</pre>
...
<img src="./manifestations1.JPG"alt="calendrier de gauche" width="319" height="412" border="1" usemap="#ImageMap1"></img>
<!/p>
</td>
<!/table>
<!p> </p>
<!p> </p>
<map name="ImageMap1">
<area shape="poly" coords="2, 2, 317, 2, 317, 82, 2, 82" OnMouseOver="na_object_show('ligneA');na_object_hide('ligneB');na_object_hide('ligneC');na_object_hide('ligneD');na_object_hide('ligneE');na_object_hide('ligneF');na_object_hide('ligneF2');na_object_hide('ligneA2');na_object_hide('ligneC2');na_object_hide('ligneD2');na_object_hide('ligneE2');na_object_hide('ligneB2');">
<area shape="poly" coords="2, 84, 317, 84,317,164,2,164" OnMouseOver="na_object_show('ligneB');na_object_hide('ligneA');na_object_hide('ligneC');na_object_hide('ligneD');na_object_hide('ligneE');na_object_hide('ligneF');na_object_hide('ligneF2');na_object_hide('ligneA2');na_object_hide('ligneC2');na_object_hide('ligneD2');na_object_hide('ligneE2');na_object_hide('ligneB2');">
<area shape="poly" coords="2, 166, 317, 166, 317, 246, 2, 246" OnMouseOver="na_object_show('ligneC');na_object_hide('ligneA');na_object_hide('ligneB');na_object_hide('ligneD');na_object_hide('ligneE');na_object_hide('ligneF');na_object_hide('ligneF2');na_object_hide('ligneA2');na_object_hide('ligneC2');na_object_hide('ligneD2');na_object_hide('ligneE2');na_object_hide('ligneB2');">
<area shape="poly" coords="2, 248, 317, 248, 317, 328, 2, 328" OnMouseOver="na_object_show('ligneD');na_object_hide('ligneB');na_object_hide('ligneC');na_object_hide('ligneA');na_object_hide('ligneE');na_object_hide('ligneF');na_object_hide('ligneF2');na_object_hide('ligneA2');na_object_hide('ligneC2');na_object_hide('ligneD2');na_object_hide('ligneE2');na_object_hide('ligneB2');">
d'avance merci pour vos aides
amicalement Pierre
kij_82
Messages postés
4088
Date d'inscription
jeudi 7 avril 2005
Statut
Contributeur
Dernière intervention
30 septembre 2013
857
14 mars 2007 à 16:16
14 mars 2007 à 16:16
En effet marche pas ous IE :)
Mais tu sais, j'ai souvent dit la même chose que toi, comme quoi IE était moins bien que FF, mais c'est parce que tu as pris l'habitude de programmer ton JS par rapport à firefox et non IE. Chacun de ces deux navigateur utilise des fonctions qui leur sont spécifiques et n'en reconnaissent pas d'autre.
Le fait que ton script ne fonctionne pas vient de ca, tu fois certainement utiliser dans ton code des fonctions que IE ne reconnait pas.
Mais pour t'aider plus il faudrait que tu nous mette ton code, notemment le code de la fonction 'hiLite' et les fonctions utilisées par cette fonction.
Mais tu sais, j'ai souvent dit la même chose que toi, comme quoi IE était moins bien que FF, mais c'est parce que tu as pris l'habitude de programmer ton JS par rapport à firefox et non IE. Chacun de ces deux navigateur utilise des fonctions qui leur sont spécifiques et n'en reconnaissent pas d'autre.
Le fait que ton script ne fonctionne pas vient de ca, tu fois certainement utiliser dans ton code des fonctions que IE ne reconnait pas.
Mais pour t'aider plus il faudrait que tu nous mette ton code, notemment le code de la fonction 'hiLite' et les fonctions utilisées par cette fonction.
ouai :p on peut voir grace a afficher la source mais je vais vous le mettre ^^ alors : html :
css :
<script language="javascript"> <!-- hide script from old browsers //detect browser: browserName = navigator.appName; browserVer = parseInt(navigator.appVersion); if (browserName == "Netscape" && browserVer >= 3) browserVer = "1"; else if (browserName == "Microsoft Internet Explorer" && browserVer == 4) browserVer = "1"; else browserVer = "1"; //preload images: if (browserVer = 1) { a1 = new Image(295,223); a1.src = "basdroit.jpg"; a2 = new Image(295,223); a2.src = "basdroithover.jpg"; b1 = new Image(319,223); b1.src = "basgauche.jpg"; b2 = new Image(319,223); b2.src = "basgauchethover.jpg"; c1 = new Image(342,218); c1.src = "hautdroit.jpg"; c2 = new Image(342,218); c2.src = "hautdroithover.jpg"; d1 = new Image(272,218); d1.src = "hautgauche.jpg"; d2 = new Image(272,218); d2.src = "hautgauchehover.jpg"; } //image swapping function: function hiLite(imgDocID, imgObjName, comment) { if (browserVer = 1) { document.images[imgDocID].src = eval(imgObjName + ".src"); window.status = comment; return true; }} //end hiding --> </script> <body> <div id="baniére"> <img src="hautdroit.jpg" width="342" height="218" name="c" usemap="m_hautdroit" class="hautdroit"/> <map name="m_hautdroit"> <area shape="circle" coords="157,106,61" href="http://erandia-online.fr-bb.com" target="_blank" alt="" onmouseover="hiLite('c','c2','Your Comment Here')" onmouseout="hiLite('c','c1','')" /> </map> <img src="hautgauche.jpg" width="272" height="218" name="d" usemap="m_hautgauche" class="hautgauche"/> <map name="m_hautgauche"> <area shape="circle" coords="122,112,61" href="accueil.html" target="_parent" alt="" onmouseover="hiLite('d','d2','Your Comment Here')" onmouseout="hiLite('d','d1','')" /> </map> <img src="basgauche.jpg" width="319" height="223" name="b" usemap="m_basgauche" class="basgauche"/> <map name="m_basgauche"> <area shape="circle" coords="171,139,61" href="download.html" target="_parent" alt="" onmouseover="hiLite('b','b2','Your Comment Here')" onmouseout="hiLite('b','b1','')" /> </map> <img src="basdroit.jpg" width="295" height="223" usemap="m_basdroit" name="a" class="basdroit"/> <map name="m_basdroit"> <area shape="circle" coords="190,116,61" href="staff.html" target="_parent" alt="" onmouseover="hiLite('a','a2','Your Comment Here')" onmouseout="hiLite('a','a1','')" /> </map> </div> </body>
css :
div#baniére { width:614px; height:441px; display:block; float:left; } .hautgauche { width: 272px; height: 218px; float:left; background-image:url(hautgauche.jpg); display:block; border:0; } .hautdroit { width: 342px; float:right; height: 218px; background-image:url(hautdroit.jpg); display:block; border:0; } .basdroit { width: 295px; float:right; height: 223px; background-image:url(basdroit.jpg); display:block; border:0; } .basgauche { width: 319px; float:left; height: 223px; background-image:url(basgauche.jpg); display:block; border:0; }
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Mais en faite rien que le map ne marche pas, >_< je comprend pas, c'est compatible avec IE normalement.
Bonjour à tous,
Je reviens sur cette discussion, car cette solution est déjà celle que j'avais et ça ne marche pas.
Sous Mozilla, ma map ne marche pas.
Sous i.e. les active X sont bloqués, mais au moins la map fonctionne.
Voici le code ma map :
<img src="photos/BrissPalette.gif" alt="" width="800" height="500" vspace="100" align="center" usemap="#Palette" style="border-style:none" />
<map id="Palette" name="Palette">
<area shape="default" coords="0,0,0,0" alt="" nohref="nohref" />
<area shape="rect" coords="282,19,362,95" href="Lanriot_Defile.htm" target="_top" alt="..." title="Défilé" />
<area shape="rect" coords="94,133,208,228" href="Lanriot_Defile.htm" target="_top" alt="..." title="Défilé" />
<area shape="rect" coords="373,224,456,315" href="Lanriot_Defile.htm" target="_top" alt="..." title="Défilé" />
<area shape="rect" coords="519,81,600,148" href="Lanriot_Defile.htm" target="_top" alt="..." title="Défilé" />
</map>
Sous Mozilla, ça ne marche pas du tout du tout.
Help !
Je compte mettre le site en ligne bientôt.
JPom
Je reviens sur cette discussion, car cette solution est déjà celle que j'avais et ça ne marche pas.
Sous Mozilla, ma map ne marche pas.
Sous i.e. les active X sont bloqués, mais au moins la map fonctionne.
Voici le code ma map :
<img src="photos/BrissPalette.gif" alt="" width="800" height="500" vspace="100" align="center" usemap="#Palette" style="border-style:none" />
<map id="Palette" name="Palette">
<area shape="default" coords="0,0,0,0" alt="" nohref="nohref" />
<area shape="rect" coords="282,19,362,95" href="Lanriot_Defile.htm" target="_top" alt="..." title="Défilé" />
<area shape="rect" coords="94,133,208,228" href="Lanriot_Defile.htm" target="_top" alt="..." title="Défilé" />
<area shape="rect" coords="373,224,456,315" href="Lanriot_Defile.htm" target="_top" alt="..." title="Défilé" />
<area shape="rect" coords="519,81,600,148" href="Lanriot_Defile.htm" target="_top" alt="..." title="Défilé" />
</map>
Sous Mozilla, ça ne marche pas du tout du tout.
Help !
Je compte mettre le site en ligne bientôt.
JPom
J'ai le meme problème pour plusieurs:
Je veux afficher des photos en mode diaporama mais avec HTML et Javascript.
merci d'avance.
SVP.
Je veux afficher des photos en mode diaporama mais avec HTML et Javascript.
merci d'avance.
SVP.
Bonjour, désolé de déterrer un vieux topic, mais j'ai moi aussi cherché a faire ca, et j'ai trouvé comment, donc je post ma solution des fois que ca serve a d'autres :
pour faire cela tu peux mettre une image (qui correspondra a la premiere image de ton diaporama) dans ta page html, puis avec du javascript, tu changes l'attribut "src" de l'image periodiquement, grace a la fonction setTimeout() qui permet d'attendre un certain temps (en millisecondes) avant d'executer une fonction.
Bien sur, il faut preloader les images utilisees dans le diaporama pour eviter un temps de chargement a chaque diapo.
Un peu de code vaut mieux qu'un long discours (Le script n'est pas de moi, mais les commentaires si):
Après il ne reste plus qu'a adapter selon le nombre d'images du diaporama, le nom de tes images, le temps d'affichage de chaque diapo etc... et bien sur a mettre une image (ici nommée 'slide') dans le code html de ta page.
pour faire cela tu peux mettre une image (qui correspondra a la premiere image de ton diaporama) dans ta page html, puis avec du javascript, tu changes l'attribut "src" de l'image periodiquement, grace a la fonction setTimeout() qui permet d'attendre un certain temps (en millisecondes) avant d'executer une fonction.
Bien sur, il faut preloader les images utilisees dans le diaporama pour eviter un temps de chargement a chaque diapo.
Un peu de code vaut mieux qu'un long discours (Le script n'est pas de moi, mais les commentaires si):
<script type="text/javascript"> //La partie ci-dessous sert a declarer des objets Image pour chaque diapo. //Notez la facon incrementale de les nommer (image1, image2, image3). var image1=new Image(); image1.src="./slide1.gif"; var image2=new Image(); image2.src="./slide2.jpg"; var image3=new Image(); image3.src="./slide3.bmp"; //variable qui represente le numero de l'image affichée var step=1; //Fonction de preloadage des images, a appeler dans le onload de la balise //body avec en arguments les images a charger function preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.p) d.p=new Array(); var i,j=d.p.length,a=preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.p[j]=new Image; d.p[j++].src=a[i]; } } } //Fonction chargée de modifier l'image du diaporama function slideit(){ //si le navigateur ne prend pas en charge l'objet image, sortir if (!document.images){ return; } //On met comme valeur de l'attribut 'src' //le chemin specifié pour l'image numero 'step' //ATTENTION! L'image dont on change la source doit s'appeler 'slide' //(dans cet exemple). document.images.slide.src=eval("image"+step+".src"); //Si on est arrive au bout du diaporama, on retourne a la premiere image if (step<3) step++; else step=1; //appel recursif apres 2.5 secondes setTimeout("slideit()",2500); } //On lance la fonction une premiere (et unique) fois. La récursivité fera le reste. slideit(); </script>
Après il ne reste plus qu'a adapter selon le nombre d'images du diaporama, le nom de tes images, le temps d'affichage de chaque diapo etc... et bien sur a mettre une image (ici nommée 'slide') dans le code html de ta page.
J'ai le même problème que je viens de régler
ll suffit de placer un # dans l'appel à la map de l'image:
<IMG SRC="accueil/accueil20072.jpg" WIDTH=749 HEIGHT=600 ALT="" usemap="#map" border="0">
et tu n'en mets pas dans la définition :
<map name="map">
<area shape="rect" coords="272,542,359,580" href="https://get.adobe.com/flashplayer/?loc=fr" target="_blank" alt="Télécharger Flash Player">
</map>
Jean-Philippe
ll suffit de placer un # dans l'appel à la map de l'image:
<IMG SRC="accueil/accueil20072.jpg" WIDTH=749 HEIGHT=600 ALT="" usemap="#map" border="0">
et tu n'en mets pas dans la définition :
<map name="map">
<area shape="rect" coords="272,542,359,580" href="https://get.adobe.com/flashplayer/?loc=fr" target="_blank" alt="Télécharger Flash Player">
</map>
Jean-Philippe