Tooltips allow additional information to be provided when an HTML element is hovered over. The standard title attribute available for any HTML element provides a basic tooltip, but the output of this attribute cannot be styled or use custom transitions to appear in interesting ways.
In this recipe we will create a Visualforce page containing a list of opportunities. Each column heading in the list provides an explanatory tooltip when the header text is hovered over. The tooltip is styled and slides down to reveal itself.
This recipe uses the jQuery (http://jquery.com/) JavaScript framework and jQuery User Interface (http://jqueryui.com/) library to produce, style, and transition the tooltip. The JavaScript and CSS files are included from the Google Hosted Libraries content delivery network rather than being uploaded as Salesforce static resources, as this makes it straightforward to move to new versions simply by changing the URL of the included file.
This recipe makes...
