How to create and add cool tooltips into web page

May 8, 2009

To create fading tooltips is easy cake.
Here are the steps:

  1. Download MooTools JavaScript framework from it’s website, http://www.mootools.com or you can find it inside this archive.
  2. Include CSS file, tooltips.css.
  3. Include JS file, tooltips.js.
  4. Make sure an image file named bubble.png is in images folder.
  5. And finally you need to add class=”tooltip” and title=”Tooltip Title :: Description goes here” on every HTML object you want to have tooltip on it.

Download the full example here.

Advertisements