Les infos bulle apparaissent à l'endroit du curseur de souris et peuvent contenir tous les éléments HTML classiques (image, tableaux, ...). Elles disparaissent dès que la souris quitte le lien.
Ce script d'infobulle est compatible Internet Explorer 4+ et Netscape 4+

Lien 1----------------------------------------------------
Lien2
 Lien3





le code
  1. <script language="javascript" type="text/javascript">
  2. <!--
  3. function GetId(id)
  4. {
  5. return document.getElementById(id);
  6. }
  7. var i=false; // La variable i nous dit si la bulle est visible ou non
  8.  
  9. function move(e) {
  10.   if(i) {  // Si la bulle est visible, on calcul en temps reel sa position ideale
  11.     if (navigator.appName!="Microsoft Internet Explorer") { // Si on est pas sous IE
  12.     GetId("curseur").style.left=e.pageX + 5+"px";
  13.     GetId("curseur").style.top=e.pageY + 10+"px";
  14.     }
  15.     else { // Modif proposé par TeDeum, merci à  lui
  16.     if(document.documentElement.clientWidth>0) {
  17. GetId("curseur").style.left=20+event.x+document.documentElement.scrollLeft+"px";
  18. GetId("curseur").style.top=10+event.y+document.documentElement.scrollTop+"px";
  19.     } else {
  20. GetId("curseur").style.left=20+event.x+document.body.scrollLeft+"px";
  21. GetId("curseur").style.top=10+event.y+document.body.scrollTop+"px";
  22.          }
  23.     }
  24.   }
  25. }
  26.  
  27. function montre(text) {
  28.   if(i==false) {
  29.   GetId("curseur").style.visibility="visible"; // Si il est cacher (la verif n'est qu'une securité) on le rend visible.
  30.   GetId("curseur").innerHTML = text; // on copie notre texte dans l'élément html
  31.   i=true;
  32.   }
  33. }
  34. function cache() {
  35. if(i==true) {
  36. GetId("curseur").style.visibility="hidden"; // Si la bulle est visible on la cache
  37. i=false;
  38. }
  39. }
  40. document.onmousemove=move; // dès que la souris bouge, on appelle la fonction move pour mettre à jour la position de la bulle.
  41. //-->
  42. </script>