[DOM] Infobulle lunatique sous IE !

1 pièce(s) jointe(s)

salut a tous,

Toujours dans le registre des info bulles, j'ai encore une problématique :

J'ai un truc parfait sous FF (voir image en pj)

Et sous IE la bulle verte ne s'affiche pas ! ...

Moi je cale purement et simplement sur ce soucis...

Merci d'avance pour votre aide...

salut

et on doit afficher la source de la page, récupérer les url des fichiers javascript et les télécharger pour voir ce qui ne va pas ??? 8O

oups j'avais oublié...

voici le code l'infobulle :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
// on formate la bulle.
document.write('<div id="bulle" class="infos_bulle"><div class="infos_bulle_haut"></div><div id="bulle_bas" class="infos_bulle_bas"></div></div>');
// on met à jour la position de la bulle.
document.onmousemove = move_bulle;
 
var i=false; // La variable i nous dit si la bulle est visible ou non
 
function ElementId(id)
{
  return document.getElementById(id);
}
 
function move_bulle(e) // Fonction de suivi de la souris
{
  if(i){
    if(navigator.appName!="Microsoft Internet Explorer"){
      ElementId("bulle").style.left = (-15)+e.pageX+"px";
      ElementId("bulle").style.top = 15+e.pageY+"px";
    }else{
      ElementId("bulle").style.left = (-15)+event.x+document.documentElement.scrollLeft+"px";
      ElementId("bulle").style.top = 15+event.y+document.documentElement.scrollTop+"px";
    }
  }
}
 
function open_bulle(content)
{
  if(i==false){
    ElementId("bulle").style.visibility = "visible"; // Si la bulle est cacher on la rend visible.
    ElementId("bulle_bas").innerHTML = content; // on copie le contenu dans la bulle
    i=true;
	move_bulle(ElementId("bulle")); // positionnement initial (correctif X.Dusart)
  }
}
 
function close_bulle()
{
  if(i==true){
    ElementId("bulle").style.visibility = "hidden"; // Si la bulle est visible on la cache
    i=false;
  }
}

Ensuite dans ma page d'affichage j'ai ceci :

Code:

 <td><span onmouseover="open_bulle(<?php echo $infobulle;?>);" onmouseout="close_bulle();" class="link_bulle"><?php echo $this->cout['name'][$c];?></span></td>

avec $infobulle qui est initialisé en php avec un tableau pour afficher les éléments de manière propre et alignée dans cette bulle...

et mon CSS:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
.link_bulle {
cursor: default;
color: gray;
border-bottom: 1px dotted gray;
}
 
.infos_bulle {
z-index: 500;
position: absolute;
top: -999px;
width: 500px;
visibility: hidden;
opacity: 0.9;
-moz-opacity: 0.9;
-khtml-opacity: 0.9;
filter: alpha(opacity=90);
}
 
.infos_bulle_haut {
height: 30px;
background: url(bulle3.png) no-repeat left top;
}
 
.infos_bulle_bas {
font: normal 10px Verdana, Arial;
color: black;
padding-left: 5px;
padding-right: 5px;
padding-bottom: 12px;
background: url(bulle3.png) no-repeat left bottom;
}

voila merci d'avance pour vos lumières...

ajoute un attribut style à ton calque "bulle"

ou refait ton infobulle en dom ...
un document.write => obselète ...

ajoute des " ou ' autour des chaines de caractères et pas de retour chariot !

Code:

open_bulle( <table> <tr> <td>Image</td> <td>Ce ...);

->

Code:

open_bulle('<table><tr> <td>Image</td> <td>Ce ...');

voir le forum php pour les addslash

alors oui ça viens des " et ' mais aussi de la façon dont j'insère mes variables...

en fait je fais ça :

Code:

$this->escape($this->cout['desc'][$c])

et j'incorporai directement dans le code pour générer l'infobulle.

Désormais j'extrait les données, j'addslashes et ça passe !

Une subtilité, merci de votre aide :)