Tutoriel ; infobulles (dif:1/5)

Lollypop (et POP) Messages : 296 Date d'inscription : 12/08/2009

Infobulles

Pour obtenir un résultat semblable ( https://i.servimg.com/u/f83/11/13/74/29/sans_t13.jpg ), veuillez prendre connaissance de se tutoriel. Il est utilisable sur vos forums (page d'accueil).

Code à insérer dans le CSS de votre forum

Code:: * {

font-family: Tahoma, Verdana, Arial, serif, Georgia, Courier New;

}
a.info {
position: relative;
color: CODE COULEUR DE VOTRE TEXTE DE L'INFOBULLE;
text-decoration: none;
}

a.info span {
display: none; /* on masque l'infobulle */
font-size: 10px;

}
a.info:hover {
background: none; /* correction d'un bug IE */
z-index: 500; /* on définit une valeur pour l'ordre d'affichage */

cursor: help; /* on change le curseur par défaut en curseur d'aide */
}
a.info:hover span {
display: inline; /* on affiche l'infobulle */
position: absolute;

white-space: nowrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */

top: 30px; /* on positionne notre infobulle */
left: 20px;

background: COULEUR DE FOND DE L'INFOBULLE;

color: COULEUR DU TEXTE DE L'INFOBULLE;
padding: 3px;

border: 1px solid #;
border-left: 4px solid #;
}

Code à insérer dans la page d'accueil de votre forum (l'éditeur HTML doit être activer)

Code:: [url=http://candy-factory.forumactif.org/]textetexte info bulle[/url]