Un tooltip rapide stp..

Holla,

 voici un petit bout de code Html et Css permettant d'afficher un Tooltip

sources : post d'inspiration initiale + les lumières de Ludo & surtout Thomas ^^ ...

code html :

<div class="showtooltipA">Hover over me!
    <div class="tooltipA">this is my <a href="http://google.fr">wunderfull</a> tip displayed on hover only :)</div>
</div>

​
code css :

.showtooltipA {
  position: relative;
}

.showtooltipA .tooltipA {
    display: none;
    position: absolute;
    top:20px;
    left: 40px;
    border: 1px solid grey;
    background-color: lightyellow;
    padding:10px;
    font-size: 1em;

}

.showtooltipA:hover .tooltipA,
.showtooltipA:focus .tooltipA {
    display: block;
}​

 testez en live ici : http://jsfiddle.net/Vqmaw/2915/
  version plus avancée : http://jsfiddle.net/Vqmaw/2920/

avantages :

• rapide à implémenter
• pas de dépendances requises
• pas de modification de la position des éléments encadrant le tooltip

inconvénients :

• très (trop?) simpliste 

Autres exemples :

• Six revisions : http://sixrevisions.com/css/css-only-tooltips/