Using any HTML inside the tooltip
Tooltip content can be any HTML, not just plain text. Move your mouse over the Download button and you'll see a tooltip that contains an image, table and a link element. You can also see the slide effect in action.standalone demo
You have enough time to move your cursor away from the trigger element and place it on top of the link that is contained inside the tooltip. You can also customize this delay from the tooltip configuration.
Note that if the trigger has a title attribute then the manual tooltip won't be displayed because the title attribute overrides the manual tooltip.
We have two things: a trigger element - which is the download button and the tooltip. By default, this tool assumes that the tooltip is placed right after the trigger element. As you can see we have a regular DIV element working as the tooltip container and it can contain anything as opposed to the simple title attribute in the previous demo.
The tooltip is styled with these settings. In this example we are using a black-arrowed background image. The important thing to notice here is that you have all the power of CSS when "skinning" the tooltip. You can change the background settings, colors, borders and fonts, etc.
We select the trigger element with the #download_now selector. If we had chosen to use a class name instead of an ID, we could select multiple triggers from the page and all of them would use the element that is positioned after the trigger as the tooltip.
Note: the slide effect is not included in the standard jQuery Tools distribution. You must download a custom combination that includes this effect.