Infobulle

[Shak]

Voilà je pensais avoir résolu mon soucis en ayant trouvée des codes CSS et HTML (je crois?) pour faire une infobulle, seulement mon incapacité à faire fonctionner un truc m'empêche de la faire apparaître..

Forum pphb2 et sous chrome.

Voilà les codes que j'ai trouvée :

Code CSS (que j'ai mis dans la partie CSS, dans les couleurs) :

Code:

/*----- INFOBULLES ------*/
 
a.imginfo span {
  display: none;
}
 
a.imginfo:hover {
  background: none;
  z-index: 999;
  cursor: help;
}
 
a.imginfo:hover span {
  display: inline;
  position: absolute;
  white-space: nowrap;
  top: 1020px;
  left: 450px;
  background: white;
  color: 7d7d7d;
  padding: 3px;
  border: 3px solid #b6b6b6;
}

Code html (je crois? Mais il faut le mettre dans le message posté? Je suis perdue..):

Code:

 <a class="imginfo">Lien sur lequel l'infobulle apparaît
<span> image que j'aimerais qui apparaisse au passage de la souris sur le nom de la personne concernée</span>
</a>

[Automne]

bonjour,

Une infobulle est constituée d'un code HTML, et d'un code CSS associé.
Le code HTML se place dans message d'accueil, sujets, QEEL, page HTML, dans la description du forum..........

Ici une infobulle sur une image.

Code:

      <div class="imginfo"><img src="lien image ou apparait l'infobulle"><span>Contenu de la bulle</span></div>

Le code CSS que vous avez se place dans panneau d'admin> affichage > couleur > feuille de style CSS

Si vous voulez une infobulle sur un lien avec image et description a l'intérieur de l'infobulle
Le code

Code:

<a class="imginfo" href="#">texte du lien<span><img src="votre image" /><div id="ll">Description de l'infobulle</div></span></a>

Le css a rajouter

Code:

div.ll{margin-right:50px; margin-top:180px;}

Le css complet

Code:

        /*----- INFOBULLES ------*/
       
        a.imginfo span {
          display: none;
        }
       
        a.imginfo:hover {
          background: none;
          z-index: 999;
          cursor: help;
        }
       
        a.imginfo:hover span {
          display: inline;
          position: absolute;
          white-space: nowrap;
          top: 300px;
          left: 350px;
          background: white;
          color: 7d7d7d;
          padding: 3px;
          border: 3px solid #b6b6b6;
  height:200px; width:200px;
} div.ll{margin-right:50px; margin-top:180px;}