+- JeuWeb - Crée ton jeu par navigateur (https://jeuweb.org)
+-- Forum : Discussions, Aide, Ressources... (https://jeuweb.org/forumdisplay.php?fid=38)
+--- Forum : Programmation, infrastructure (https://jeuweb.org/forumdisplay.php?fid=51)
+--- Sujet : [REGLE] Bug d'affichage sur IE (/showthread.php?tid=1885)
[REGLE] Bug d'affichage sur IE - Ogham - 12-11-2007
Bonjour,
Quelqu'un saurait il me dire pourquoi IE refuse d'afficher le résultat de ce code qui fonctionne parfaitement sur firefox ?
Je ne vois absolument pas ce qui pourrait clocher.
voilà le code en question
Code PHP :
<?php
require("connection_bd.php");
$retour=mysql_query( "SELECT * FROM localisation");
while ($donnees = mysql_fetch_array($retour))
{
$id=$donnees['id'];
$nom=$donnees['nom'];
$x=$donnees['x'];
$y=$donnees['y'];
$description = nl2br(stripslashes($donnees['description']));
?>
<div class="calque4">
<a href="ville.php?id=<?php echo $donnees['id'];?>&nom=<?php echo $donnees['nom'];?>&x=<?php echo $donnees['x'];?>&y=<?php echo $donnees['y'];?>&description=<?php echo $donnees['description'];?>"
<IMG STYLE="position:absolute;z-index:2;
TOP:<?php echo $y;?>px;
LEFT:<?php echo $x;?>px;
WIDTH:7px; HEIGHT:7px"
SRC="images/carte/point_cite.gif"alt="image ville" />
</a>
</div>
<?php
}
merci pour votre aide.
RE: Bug d'affichage sur IE - X-ZoD - 12-11-2007
on peut avoir des screen de chacun ? (pense a les redimensionner par pitié)
sinon la tout de suite je te dirai que c'est tes "style" qui ne sont pas pris en compte sur chacun des navigateurs
RE: Bug d'affichage sur IE - Ogham - 12-11-2007
Ah ben oui c'est bien ça, maintenant ça marche
Merci Prélude.
RE: Bug d'affichage sur IE - Ogham - 13-11-2007
Bonsoir,
Je réutilise ce message puisque mon nouveau problème est un peu du même ordre un peu plus bas dans le code de ma carte donc ...
Pour situer un peu:
Ma carte est un bête fond de carte affiché en background sur lequel sont affichées des repères (points), le plus souvent des liens dont les coordonnées (x,y) sont récupérées dans ma bdd.
Il y a donc des points pour figurer les villes et j'essaie de mettre une infobulle (tout css) sur ces points.
Mon code fonctionne parfaitement sur firefox mais bug gravement sur IE.
d'abord voilà le code:
Code PHP :
<?php
// le css
<style>
a.info {
position: absolute;
}
a.info span {
display: none;
}
a.info:hover {
background: none; /* correction d'un bug IE */
z-index: 500;
}
a.info:hover span {
display: inline;
width:200px;
height:260px;
background:#fdf7ed;
line-height:15px;
color: #717556;
padding: 5px;
border:1px dashed #bcbe92;
}
</style>
// le html (toutes les données sql sont bien récupérées avant)
<div class="calque3">
//là l'image lien
<a href="fiche_joueur.php"class="info">
<IMG STYLE="position:absolute;z-index:2;
TOP:<?php echo $y;?>px; LEFT:<?php echo $x;?>px;
WIDTH:2px; HEIGHT:2px"
SRC="images/carte/point.gif"alt="image ville" />
//là les caractéristiques de l'infobulle (première partie)
<span STYLE="position:absolute;top:<?php echo $y1;?>px;left:<?php echo $x1;?>px;">
//contenue de l'infobulle (je l'ai retiré pour plus de clarté il ne semble pas poser problème)
</span>
//là les caractéristiques de l'infobulle (deuxième partie)
<span STYLE="position:absolute;height:140px;text-align:center;top:<?php echo $y2;?>px;left:<?php echo $x2;?>px;">
//contenue de l'infobulle
</span>
</a>
</div>
voilà ce que ça donne à l'écran:
![[Image: capture1tp3.jpg]](http://img263.imageshack.us/img263/5148/capture1tp3.jpg)
la flèche grise c'est le curseur de la souris.
A l'ouverture de la carte tout semble normal et tant qu'on ne survole pas de lien on peut aller partout rien ne se passe.
Quand on pointe un lien ça s'ouvre correctement et tout est bien placé.
Par contre:
Sur IE uniquement
premier problème:
quand on quitte l'infobulle elle se ferme mais l'image qu'il y a dedans elle reste affichée.
Et à la fin on se retrouve avec autant d'images sur la carte que de liens survolés.
de plus elle devient réactive et si on passe dessus l'infobulle s'ouvre à nouveau.
second problème:
une fois qu'on a ouvert puis refermé l'infobulle une fois, toute la zone qu'elle occupait (le fond blanc sur l'image donc) devient réactive et le reste, ouvrant l'infobulle à chaque fois qu'on y repasse.
Sur firefox tout se passe très bien
donc j'aimerais savoir si l'un / l'une d'entre vous voit un problème dans mon code ou connait un truc pour faire comprendre à Internet explorer qu'il doit tout masqué quand on ne lui demande rien.
Ou à défaut si quelqu'un aurait un exemple d'infobulle (si possible en css car javascript j'y connais rien) qui fonctionne correctement sur IE.
Pour ma part j'ai fais des dizaines de test de codes trouvés ici et là et n'ai rien trouvé qui convienne pour le moment.
voilà
merci.
RE: [REGLE] Bug d'affichage sur IE - Ogham - 13-11-2007
Bonjour,
finalement j'ai trouvé une solution à mon problème
@Prélude
Toutes les balises étaient bien fermées le problème ne venait pas de là ni du contenue de la bulle.
finalement j'ai remanié un peu le code en me basant sur l'exemple d'infobulle personnalisée donné sur le SDZ.
je met le code qui marche ça peut toujours servir
Code PHP :
<?php
a.info {}
a.info span {
l display: none; /* on masque l'infobulle */
}
a.info:hover {
background: none; /* correction d'un bug IE */
z-index: 500; /* on définit une valeur pour l'ordre d'affichage */
}
a.info:hover span {
display: inline; /* on affiche l'infobulle */
position: absolute;
width:200px;
height:260px;
background: white;
border: 1px solid green;
z-index: 500;
}
<a href="#" class="info" style="position:absolute;z-index:2;
TOP:<?php echo $y;?>px; LEFT:<?php echo $x;?>px;">
<img SRC="images/carte/point.gif"/>
<span STYLE="top:<?php echo $y1;?>;left:<?php echo $y1;?>px;height:140px;"></span>
<span STYLE="top:<?php echo $y2;?>px;left:<?php echo $x2;?>px;height:200px;"></span>
</a>
Il semble que le probème venait de là:
Code PHP :
<?php
<a href="fiche_joueur.php"class="info">
<IMG STYLE="position:absolute;z-index:2;
TOP:<?php echo $y;?>px; LEFT:<?php echo $x;?>px;
WIDTH:2px; HEIGHT:2px"
SRC="images/carte/point.gif"alt="image ville" />
Il ne fallait pas positionner l'image du lien mais la class info
Code PHP :
<?php
<a href="#" class="info" style="position:absolute;z-index:2;
TOP:<?php echo $y;?>px; LEFT:<?php echo $x;?>px;">
<img SRC="images/carte/point.gif"/>
J'ai une autre petite question.
J'ai remarqué qu'IE ne tient pas compte de mes indications z-index mais affiche les éléments en fonction de l'ordre dans lequel ils apparaissent dans mon code.
le premier est à l'arrière plan et le dernier se retrouve par dessus tous les autres.
Est ce normal ? ou ai je fais encore quelque chose de travers ?
merci.
bonne journée.
RE: Bug d'affichage sur IE - Ogham - 14-11-2007
bien, après avoir creusé un peu le sujet des z-index sur IE il semble que ce soit un problème connu.
Je vais donc faire avec.