Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Recommendations for jQuery tooltips

Tags:

jquery

tooltip

I am looking for tooltip plugins for jQuery that would allow for the following type of behavior.

<a href="somewhere.html">
 <span>
  <img src="someimage.jpg" style="display: none;" />
  Here is the tooltip content.
 </span>
 Here is the link to somewhere.
</a>

The behavior that I am hoping for is to hover over "Here is the link to somewhere" and have a tooltip pop up showing the content of the span containing "someimage.jpg" and "Here is the tooltip content".

I would prefer that the tooltip track along with the mouse's movement over the link and that the tooltip's appearace (background color, opacity, border color, etc.) be configurable.

The two most popular tooltips that I have found, "clueTip" and Jörn Zaefferer's "Tooltip" do not seem to fit the bill, unless I am missing something.

Ultimately, the links and images will be dynamically generated.

like image 951
jerome Avatar asked Feb 12 '09 21:02

jerome


People also ask

What is the use of tooltip in jQuery?

The jQuery UI tooltip() method adds tooltip to any element on which you want to display tooltip. It gives a fade animation by default to show and hide the tooltip, compared to just toggling the visibility. Syntax: You can use the tooltip() method in two forms.

How do I show dynamic tooltip?

Here's how: Drag the calculated field to the appropriate tooltip and you'll see an ATTR dimension pill with a tooltip logo in the Marks card. Insert the ATTR budget and adjusted inflated gross calculated fields into its corresponding tooltip as seen in Image 6. After that, you're dynamic tooltip should work!

Which tag is used for tooltip?

Basic Tooltip HTML: Use a container element (like <div>) and add the "tooltip" class to it. When the user mouse over this <div>, it will show the tooltip text. The tooltip text is placed inside an inline element (like <span>) with class="tooltiptext" .


1 Answers

OHHHHHHHH Best one ever!

http://bassistance.de/jquery-plugins/jquery-plugin-tooltip/

Demos: (look for the the "Link to yahoo" example to meet all of your needs)

http://jquery.bassistance.de/tooltip/demo/

EDIT: i see you mentioned Jorn (i didn't know his name) but look for the "yahoo" example it should do what you want.

like image 180
missaghi Avatar answered Oct 05 '22 02:10

missaghi