GTL, dites aurevoir aux tooltips ternes

01/08/2007
WebDev et Design Allez aux commentaires

Vous désirez rendre l'expérience de la navigation sur votre site/blog plus attrayante ?

GTL va vous y aider ! GTL et un petit bout de javascript qui va vous permettre des faire de très jolis tooltips !

Pour celà:

  1. Incluez le javascript
    2. <script type="text/javascript" src="js/glt.js"></script>
  2. Ajoutez ce style css (modifiable)
    3. .glt-elm{
            position: absolute;
            left: 0;
            top: 0;
            width: 150px;
            color: #fff;
            opacity: 0.9;
            visibility: hidden;
            filter:progid:DXImageTransform.Microsoft.Alpha(opacity=90);/*hack pour ie*/
    }
    .glt-elm p{
            background: #666;
            margin: 0;
            padding: 0.5em;
    }
    .glt-elm img{
            display: block;
    }
  3. Utiliser ces 2 images top rounded image et bottom rounded image

Et voilà, tous vos éléments comportant un attribut "title" possède un tooltip !

Liens

-----

Articles relatifs

  • WhyNot

    Également, je ne peux que conseiller l’utilisation du framework Mootools, qui propose la réalisation de Tooltips et bien d’autre chose encore.

    Merci pour l’article

  • k-ny

    De rien.

    C’est clair que l’on trouve pas mal de script pour mootools, très à la mode 🙂