pb compatibilité ie/ info bulleRésolu

Question

Bonjour,
j'ai créer un planning, chaque case de mon planning peut contenir une image ou une couleur issue de ma base mysql (par requete php), sur chaque case, il y a la possibilité d'afficher une info bulle au passage de la souris. tout fonctionne sauf mon info bulle qui apparait transparente. l'info bulle apparait derrière la couleur ou l'image dans la case. cela fonctionne sous firefox mais pas sous ie. je precise que mon info bulle est faite en css, que j'utilise le php pour les requètes et du javascript pour l'affichage du planning et des cases. 
J'ai essayer diverses solutions que j'ai trouver sur se site mais aucune ne fonctionne. Pourriez vous m'aider?

Voici le code css utilisé:
/***************  Gestion des infos bulles  ******************/

.calEvent span {
z-index: 1001;
display: none;}

.calEvent:hover {
background: none;
z-index: 40;
cursor: help;}

.calEvent:hover span {
display: inline;
position: fixed; /*  relative ne fonctionne pas inherit non plus, absolute  static */
overflow: visible;
white-space: nowrap;
z-index: 1001;
visibility: visible;
margin-top: 20px;
margin-left: 10px;
background: rgb(255,255,204);/* correspond à #F5F5DC; */
/* background-image: url('/SRC-APRI/images/2325865367_13993ccdc7.jpg'); */
color: green;
padding: 3px;
border: 2px solid black;
border-radius: 10px 10px;
-moz-border-radius: 10px;}

/***************  Fin Gestion des infos bulles  ******************/

Bul3 · Accepted Answer

nickel si ça baigne
pour les erreurs css/html IE7 et précédents sont pour 
le moins légers, au niveau signalement. 
[mon Site][M'écrire]Bul

Bul3 · Answer

bonjour,

quelle version IE ? 
avant IE7, il y aura peut-être du css mal traité
et il faudra ajouter du javascript, mais faut voir
( hover par exemple est seulement géré sur les balises mon Site][M'écrire]Bul

elisabeth_nov · Answer

j'utilise ie 7 quand au doctype j'ai mis celui-ci
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Bul3 · Answer

alors à priori, pas de raisons, ça doit baigner.

tu peux nous mettre UN TOUT PETIT EXTRAIT
avec l'élément qui a class="colEvent"...
mais le minimum, et surtout pas le PHP !
la page html résultante ( sinon, on sera
quasi incapable de deviner ce que ça
génère )... quelques lignes html quoi...

je ferais bien ( quoique ? ), mais ça risque de ne
pas correspondre à donc ça ne résoudrait rien

[mon Site][M'écrire]Bul

elisabeth_nov · Answer

Mon code ne comprend que du php et un peu de javascript pour l'affichage du planning et de l'info bulle donc pour un apercu ca risque d'etre dur si tu ne veux que du html.

Bul3 · Answer

ah bon ? et le php ne crée pas de html ?
ben alors, il ne peut pas fonctionner sur un micro coté client. ;o))

tu lances ton machin, une page s'affiche : c'est du html,
tu fais alors affichage / Code Sources, tu sauvegardes vers un fichier, 
ou Fichiers / Enregistrer sous
    puis tu en fais l'extrait nécessaire
    tu testes pour voir si cet extrait nous permet de pouvoir t'aider
    et si c'est ok : les 10 lignes tu nous les postes ici

[mon Site][M'écrire]Bul

elisabeth_nov · Answer

Voici ce qui est générer pour une case de mon planning, si ca peut aider: CSS: apparition d'infobulles - Développement web

Commentaires:

Evènement: Horaire changé pour raison service
passage en horaire: 09h45-18h00

Notes:

elisabeth_nov · Answer

Mon code est loin de ne faire que 10 lignes désolée.

Bul3 · Answer

je ne comprend pas....
tu fais soit disant une info-bulle en css et
    en fait... c'est que du javascript !?!?

    onmouseover="PosBulle(19521);" 
    ça va faire double emploi avec le css ! ça va se mordre la queue...
    quoique... dans PosBulle, tout est en commentaires ?

et....
        

t'as pas l'impression 
qu'il manque une ch'tiote " là ?
que &nbsp; irait mieux ?

bref faut d'abord rectifier les erreurs html
( et probablement simplifier ce nombre de div+span+....  
  mais bon, on verra après  )

[mon Site][M'écrire]Bul

Bul3 · Answer

j'ai ( très très vaguement  !!) testé 

en sucrant purement et simplement le javascript,
en rectifiant les erreurs html...
bah.. ça prend forme et il ne doit pas manquer grand chose
pour que ça baigne comme tu l'entend.

[mon Site][M'écrire]Bul

elisabeth_nov · Answer

dans posbulle, tout est en commentaire et dans 

 ou est le probleme? je  suis stupide ok, mais la je saisi pas?

Bul3 · Answer

je ne parle même pas, pour l'instant du css dans la balise

elisabeth_nov · Answer

peut me mettre ton test que je saisisse parce que là, je suis paumée!!

Bul3 · Answer

ben... tu as un style="..... sans " de fermeture
et ce n'est pas &nbsp mais &nbsp; 

le moindre éditeur avec coloration syntaxique te le montre,
FireFox dans sa console d'erreurs probablement aussi ( et IE8 je suppute )
...

[mon Site][M'écrire]Bul

Bul3 · Answer

style="background:#000000;">
                    &nbsp;&nbsp;&nbsp; passage en horaire: 09h45-18h00

Notes: 

et franchement : simplifie le reste !!!

[mon Site][M'écrire]Bul

Bul3 · Answer

d'ailleurs je n'ai pas testé avec FF puisque tu disais
que ça baignait.. mais j'ai un très très gros doute !
ou alors tu ne regardes pas les erreurs...
à propos :
Navigateurs |Quelques Expplications |----
Chrome
, contrôler page actuelle / Options pour développeurs
/ Console Javascript, ----
FireFox
, Outils / Console d'erreurs
et mieux  : télécharger mon Site][M'écrire]Bul

elisabeth_nov · Answer

sous firefox cela fonctionne a la perfection mais pas sous ie, le problème que j'ai  (je sais pas si ca sera plus clair) c'est que mon planning se divise en deux: matin et aprem se qui correspond chacun à un div, si je met un commentaire le matin (info bulle) quand je passe la souris, la partie de l'info bulle qui devrai etre sur le div aprem ne s'affiche pas, elle est transparente et je ne comprend pas pourquoi puisque le reste fonctionne (mieux depuis que j'ai suivi tes modifications d'ailleurs, merci ^^)

Bul3 · Answer

pas avec ce que tu nous donnes !
il est vrai que FF ne fait que noter les erreurs et qu'il faut aller les lire. mais bon :

c'est sûr, FF donne une erreur !
maintenant, tu rectifies ou pas, c'est comme tu le sens,
mais sans ces modifs, ça ne sert à rien d'aller plus loin
et si tu les as fait.. ben donnes nous le résultat

[mon Site][M'écrire]Bul

elisabeth_nov · Answer

Firefox ne m'as pas donnée d'erreur, les modif sont faite mais le problème n'est pas résolus, je continue de chercher parce que je pense que c'est un problème de div ou de z index, donc merci de t'être penché sur le problème. De tout manière, il n'y a qu'en cherchant que je trouverai, en attendant mon planning tourne sous firefox donc c'est pas l'urgence (mais au final, il doit fonctionner avec ie7, c'est pour ça que je galère), donc je continue et je vais surtout revoir mon code complet pour dénicher toute mes petites erreurs. Merci à toi pour toute ton aide.

Bul3 · Answer

>>les modif sont faite mais le problème n'est pas résolus,
aucun doute : il te reste des erreurs
( si les z-index fonctionnent avec FF, ça fonctionne avec IE )
[mon Site][M'écrire]Bul

Pb compatibilité ie/ info bulle

33 réponses

Votre réponse

Discussions similaires