The HTML side of the tooltip is nothing but an span tag and the class 'toolTip' added along with a title attribute. The JavaScript pulls the text out of the title attribute in the span and dumps it in the tooltip bubble. In this example I am using a span, but this will work in pretty much any HTML tag with the specified class and a title attribute. Check out the live example below:
What is this?
You can also leave text out of the span tag and just the help icon will apear (Be sure to use a non breaking space when there is no text). It is an inline element so you can place it anywhere like this:
This has been tested and works in Firefox, IE7, IE6, Opera 9.23 and Safari 3.0.4 on Windows XP. There are a couple little annoying issues with IE6 but nothing I felt like stressing over. Older browsers will probably have issues but will work for well over 90% of internet users.
Send me a line if you have any suggestions jon@3nhanced.com