Windows® 8.1 Apps with HTML5 and JavaScript Unleashed

Using the Tooltip Control

You can use the WinJS Tooltip control to display a customizable tooltip over any HTML element (see Figure 4.4). When you hover over the element, the tooltip appears for a certain number of seconds. When you move your cursor away from the element, the tooltip disappears.

FIGURE 4.4 Displaying a tooltip with the Tooltip control (tooltip\tooltip.html)

You declare the Tooltip control in a page like this:

Click here to view code image

<button id="btnDelete"    data-win-control="WinJS.UI.Tooltip"    data-win-options="{        innerHTML: 'Deletes the <b>record</b> from the database'    }">Delete</button>

Warning

Remember ...