Tooltip - infobulle

Contenu du snippet

Cette source permet d'apporter une information, une description ou autre dans une infobulle.
L'infobulle se rend visible quand on passe le curseur sur l'objet et disparait quand on retire le curseur.

Source / Exemple :


<script language=javascript>
ns4 = (document.layers)? true:false
ie4 = (document.all)? true:false
document.write('<div  id=description style="visibility:hidden;position:absolute;border:1 solid #000000"></div>');
function description(code) {
if (ns4) {var mouseX=e.pageX; var mouseY=e.pageY}
if (ie4) {var mouseX=event.x; var mouseY=event.y}
if(document.getElementById) {
document.getElementById("description").innerHTML = '<table cellpadding=2><td>'+code+'</td></table>';
document.getElementById("description").style.visibility = 'visible'
document.getElementById("description").style.left = mouseX;
document.getElementById("description").style.top = mouseY + 10;
} } 
function destroy() { if(document.getElementById) { document.getElementById("description").style.visibility = 'hidden' } }
</script>
<a href=# onmouseover="description('<b>Titre</b><hr>code HTML')" onmouseout="destroy()">Passe le curseur ici !</a>

Conclusion :


Merci à editeurjavascript.com pour ses cours très instructifs.

A voir également

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.