IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

[DOM] Infobulle lunatique sous IE !


Sujet :

JavaScript

  1. #1
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2005
    Messages
    202
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2005
    Messages : 202
    Par défaut [DOM] Infobulle lunatique sous IE !
    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...
    Images attachées Images attachées  

  2. #2
    Rédacteur
    Avatar de bigboomshakala
    Homme Profil pro
    Consultant Web .NET
    Inscrit en
    Avril 2004
    Messages
    2 077
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France, Val de Marne (Île de France)

    Informations professionnelles :
    Activité : Consultant Web .NET
    Secteur : Finance

    Informations forums :
    Inscription : Avril 2004
    Messages : 2 077
    Par défaut
    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 ???

  3. #3
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2005
    Messages
    202
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2005
    Messages : 202
    Par défaut
    oups j'avais oublié...

    voici le code l'infobulle :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    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 : Sélectionner tout - Visualiser dans une fenêtre à part
     <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 : Sélectionner tout - Visualiser dans une fenêtre à part
    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...

  4. #4
    Membre Expert
    Inscrit en
    Septembre 2002
    Messages
    2 307
    Détails du profil
    Informations forums :
    Inscription : Septembre 2002
    Messages : 2 307
    Par défaut
    ajoute un attribut style à ton calque "bulle"

  5. #5
    Expert confirmé
    Avatar de le_chomeur
    Profil pro
    Développeur informatique
    Inscrit en
    Février 2006
    Messages
    3 653
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations professionnelles :
    Activité : Développeur informatique

    Informations forums :
    Inscription : Février 2006
    Messages : 3 653
    Par défaut
    ou refait ton infobulle en dom ...
    un document.write => obselète ...

  6. #6
    Membre Expert
    Inscrit en
    Septembre 2002
    Messages
    2 307
    Détails du profil
    Informations forums :
    Inscription : Septembre 2002
    Messages : 2 307
    Par défaut
    ajoute des " ou ' autour des chaines de caractères et pas de retour chariot !

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    open_bulle(     <table>       <tr>         <td>Image</td>         <td>Ce ...);
    ->
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    open_bulle('<table><tr>         <td>Image</td>         <td>Ce ...');
    voir le forum php pour les addslash

  7. #7
    Membre confirmé
    Profil pro
    Inscrit en
    Mai 2005
    Messages
    202
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2005
    Messages : 202
    Par défaut
    alors oui ça viens des " et ' mais aussi de la façon dont j'insère mes variables...

    en fait je fais ça :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    $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

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. [DOM] <select> JAVASCRIPT sous IE
    Par kosowski dans le forum Général JavaScript
    Réponses: 7
    Dernier message: 19/06/2008, 16h43
  2. [DOM] noeud vide sous firefox
    Par le_chomeur dans le forum Général JavaScript
    Réponses: 3
    Dernier message: 22/11/2007, 13h41
  3. [DOM] Menu déroulant et DOM. Afficher les sous-menus cachés
    Par glenouve dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 14/11/2007, 10h42
  4. [DOM]Problème de liens sous ie
    Par Buster dans le forum Général JavaScript
    Réponses: 3
    Dernier message: 17/05/2005, 16h13
  5. Infobulle sous Netscape
    Par nicolb dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 20/02/2005, 01h03

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo