info bulle un peu spéciale

[Xenos]

CSS le permet.

Code :

#objet
{
/*Skin normal de l'objet qui fera apparaitre l'info-bulle*/
}
#infobulle
{
/* Skin de l'info bulle telle que tu voudras qu'elle s'affiche */
display: none;
/*Ou visibility: hidden, les deux sont à tester */
}
#objet:hover #infobulle
{
visibility: visible; /* ou display: block */
}

Normalement, si infobulle est enfant de l'objet "objet", alors au survol de objet (objet:hover) la 2e règle sera appliquée à "infobulle".


Au fait: avec ce système, on aura un soucis sur les plateformes mobiles tactiles: le mouseover n'existe pas je crois... Donc, soit il faut se rabbatre sur un autre sélecteur (:active?), soit il faudra utiliser en plus un javascript de type:

onclick='javascript: document.getElementById("infobulle").className += "classeOver"; return false;'

et, dans le css, coupler la ligne du sélecteur "hover" avec le nom de classe demandé:

#objet:hover #infobulle, .classeOver