Mouse-Over/Hover Text Bubbles??

Permalink
Hello all,

Forgive me if the answer to this question has been posted a million times, but I can't seem to find it with the search terms I've been using.

Basically the scenario is this: I have an image on my website that is a sort of "Progress Bar" or "Progress Meter" for a large project. The bar is divided into segments or squares, each one representing a major step or phase of the project. I don't want the individual segments to link to anything or go anywhere, but I want a mouseover text bubble to popup and describe the details of each phase. Very much like the beautiful text popups that appear when you mouseover someone's user icon in this message board. How are these done? I was hoping for a simple add-on, but no such luck.

Any advice would be welcome. Also, the image looks like this:

1 Attachment

jamesstark
 
jordif replied on at Permalink Reply
jordif
Hello,

these are usually called "tooltips". For example, you coud use a jQuery plugin:
http://jqueryui.com/tooltip/#custom-style...

Or Bootstrap:
http://twitter.github.com/bootstrap/javascript.html#tooltips...

Someone posted a "how to" for using the bootstrap tool tip:
http://www.concrete5.org/documentation/how-tos/developers/using-cor...

And a forum discussion about this same issue:
http://www.concrete5.org/community/forums/usage/javascript-image-to...

Hope it helps at least to get you started :-)