Basics of using the tooltip
You need two things: the elements that show the tooltips when the cursor is placed on top of them, these elements are called triggers. You also need one or more tooltip elements. In this setup we have a single tooltip element that works for all of the triggers:
Trigger elements can be anything such as a, div, samp and table elements.
By default the Tooltip generates the tooltip element automatically and assigns the CSS class name tooltip to it. It should be initially hidden by the CSS by setting display: none. We have no specific styling for the trigger elements.
Tooltip activation starts by selecting the trigger elements with jQuery. Here we select all img tags that have a title attribute and are nested inside an element with id demo. We supply one argument for the tooltip initialization call which is a jQuery selector to the tooltip element.
The default behaviour is that the tooltip is positioned on the top/center of the trigger and it slides upwards. Of course, the positioning and the sliding effect can be altered in the configuration as will be seen in the upcoming demos.
Enclosing your call inside $(document).ready executes the script right after the document is scriptable. Read more about that in the User's Manual.