How to create a tooltip using jQuery?

Question

How can I put a tooltip on the label of all the switches in the form? I use simple_form to generate the layout of the form, so each label has an attribute for (for example, for="reward_id_79" ), which I could use to associate the label with the corresponding image img src='blah.jpg' id='reward_id_79' .

Each radio will have a related image, which I would like to display in a pop-up window of a tooltip when the user hovered over the text of the label. I would not want to change the output of simple_form, but instead had a series of hidden images elsewhere on the page.

Answer 1

Take a look at the jQuery poshytips plugin.

http://vadikom.com/demos/poshytip/

It does a lot of what you need and is really easy to use.

Answer 2

There is a jQuery tooltip plugin that you can try that looks like a full-featured one.