Search within TutorialsPark

jQuery UI : Tooltip Methods


Learn how to use jQuery UI Tooltips methods to manipulate and control tooltips.


jQuery UI : Tooltips

The jQuery UI Tooltip Widget provides a rich set of methods which can be used to manipulate and control tooltip and alter its behaviour.

The table below has a list of such methods.


Table : jQuery UI Methods

Method Description
close To close a tooltip. It should be used for non-delegated tooltips.
destroy To remove the tooltip and its functionality completely.
disable To disable the tooltip
enable To enable the tooltip
open To open a tooltip programmatically. It is to be used for non-delegated tooltips.
option To get or set the value associated with the defined optionName
widget To get a jQuery Object containing the original element.

jQuery UI Tooltips : Enable and Disable Tooltips

The jQuery UI Widget's active Tooltips can be enabled and disabled programmatically using methods of enable and disable respectively.

In the demo below, button elements are used along with click event to call the tooltip() widget.The string enable or disable is passed as the first argument.

Example: jQuery UI Tooltip - Enable and Disable Tooltip

Give it a TRY! » Note: You can also pass the index no of the tab to be opened as an argument.


jQuery UI Tooltip : To Display Tooltips Programmatically

jQuery UI tooltip widget can be made to display and hide tooltip at will, by using a button

In the demo below, the event click is used to call the tooltip widget and then display the tooltip, to effect this the string open/close is passed as an argument for the tooltip() method.

Example: jQuery UI Tooltip - To Display Tooltips Programmatically

Give it a TRY! » Note: Click on the open and close button to show and hide tooltip.