YAHOO.widget.Tooltip
var tooltip1;
var tooltip2;
var tooltip3;
function init() {
tooltip2 = new YAHOO.widget.Tooltip("tt2", { context:"link" } );
tooltip3 = new YAHOO.widget.Tooltip("tt3", { context:"img", showdelay: 1000 });
}
YAHOO.util.Event.addListener(window, "load", init);
Tooltip Example
The creation of a Tooltip is very straight-forward. To instantiate a Tooltip, the code looks like this:
tooltip1 = new YAHOO.widget.Tooltip("tt1", { context:"btn1", text:"I'm a button. You can click me!" } );Tooltips are generally always created dynamically, and never need to be marked up in advance. The first argument is the DOM id that you want to associate with the Tooltip. The second argument is the user configuration object literal used for configuring the Tooltip. If no text is specified, the Tooltip will attempt to use the object's title attribute to set the text.
The first example, tooltip1, is included in an inline script tag to demonstrate that Tooltip classes can be included inline during document rendering.
By default, are shown after 200ms, displayed for 5 seconds and dismissed, or hidden 250ms after moving the mouse away from the context element. You can configure these timings, as shown in the code for tooltip3 (the one associated with the image), where we cause the Tooltip to display after 1 second, instead of the default:
tooltip3 = new YAHOO.widget.Tooltip("tt3", { context:"img", showdelay: 1000 });