Des info-bulles originals

Contenu du snippet

Juste un copier/coller suffit

Source / Exemple :


<html>
  <head>
  <!--left et top sont la position du texte.-->
    <style type="text/css">
    <!--           left: 40px;
          top: 220px;
          visibility: hidden;}//-->
    </style>

    <style type="text/css">
    <!--           left: 100px;
          top: 350px;
          visibility: hidden;}//-->
    </style>

    <style type="text/css">
    <!--           left: 150px;
          top: 200px;
          visibility: hidden;}//-->
    </style>

    <style type="text/css">
    <!--           left: 280px;
          top: 280px;
          visibility: hidden;}//-->
    </style>
    
    
    
    <script>
    <!-- Masqué pour les anciens navigateurs

    //
    // Voici les calques
    //
    niveaux = document.all;
    if (! niveaux)
        niveaux = document;

    function OnOff (quoi, comment) {

      if (quoi) {
      
        if (quoi.style) {
        
          quoi.style.visibility = comment;
        }
        
        if (quoi.visibility) {
        
          quoi.visibility = comment;
        }
      }
    }

    function Off (quoi) {
    
      //
      // Désactive un niveau
      //
      OnOff (quoi, "hidden");
    }
    
    function ActiverOnOff (quoi) {
    
      //
      // Tout désactiver
      //
      Off (niveaux.Pos1);
      Off (niveaux.Pos2);
      Off (niveaux.Pos3);
      Off (niveaux.Pos4);
      
      //
      // puis activation d'un niveau
      //
      if (quoi)
        OnOff (quoi, "visible");
    }
    
    
    // -- Le reste n'est pas masqué -->
    </script>

  </head>

  <body text="    onLoad="ActiverOnOff ();">
  <center>
  <h1>Voici quelques Info-Bulle original</h1>
  <br><h2>Passez sur les liens ?</h2></center><br> 
  
  <font size="+2">

   <!--4000 est le temps de visibilité du texte.-->
  <center>
  <a href="Pub1.html"
    onMouseOver="ActiverOnOff (niveaux.Pos1);
           window.setTimeout ('Off (niveaux.Pos1);', 4000);"
    onMouseOut="ActiverOnOff ();">Pub 1</a> -

  <a href="Pub2.html"
    onMouseOver="ActiverOnOff (niveaux.Pos2);
           window.setTimeout ('Off (niveaux.Pos2);', 4000);"
    onMouseOut="ActiverOnOff ();">Pub 2</a> -

  <a href="Pub3.html"
    onMouseOver="ActiverOnOff (niveaux.Pos3);
           window.setTimeout ('Off (niveaux.Pos3);', 4000);"
    onMouseOut="ActiverOnOff ();">Pub 3</a> -
  
<a href="Pub4.html"
    onMouseOver="ActiverOnOff (niveaux.Pos4);
           window.setTimeout ('Off (niveaux.Pos4);', 4000);"
    onMouseOut="ActiverOnOff ();">Pub 4</a></center>

  </font>
  
  
  <div id="Pos1">
    <table bgcolor="      <tr><td>
      <font face="Comic Sans MS">
        <b>Bonjour ! Passez sur les liens<br>
          vous aurez l'adresse de tous mes sites.</b>
      </font>
      </td></tr>
    </table>
  </div>  

  <div id="Pos2">
    <table bgcolor="      <tr><td>
      <font face="Comic Sans MS">
        <b>Ici, en route vers http://www.chez.com/pitrack1.</b>
      </font>
      </td></tr>
    </table>
  </div>  

  <div id="Pos3">
    <table bgcolor="      <tr><td>
      <font face="Comic Sans MS">
          <b>La je vous entraîne vers<br>
          http://www.multimania.com/pitrack1...</b>
      </font>
      </td></tr>
    </table>
  </div>  

  <div id="Pos4">
    <table bgcolor="      <tr><td>
      <font face="Comic Sans MS">
        <b>... et celui-ci vers<br>http://www.respublica.fr/yalaqueu</b>
      </font>
      </td></tr>
    </table>
  </div>  

  </body>
</html>

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.