可自定义的、可主题化的工具提示框，替代原生的工具提示框。
工具提示框（Tooltip）取代了原生的工具提示框，让它们可主题化，也允许进行各种自定义：
- 显示不仅仅是标题的其他内容，就如内联的脚注或通过 Ajax 检索的额外内容。
- 自定义定位，例如，在元素上居中工具提示框。
- 添加额外的样式来定制警告或错误区域的外观。
默认使用一个渐变的动画来显示和隐藏工具提示框，这种外观与简单的切换可见度相比更具灵性。这可以通过 show 和 hide 选项进行定制。
items 和 content 选项需要保持同步。如果您改变了其中一个，您需要同时改变另一个。
在一般情况下，禁用的元素不会触发任何 DOM 事件。因此，适当地控制禁用元素的工具提示框是不可能的，因为我们需要监听事件来决定何时显示和隐藏工具提示框。这就导致 jQuery UI 不能保证对附加到禁用元素上的工具提示框任何层次上的支持。这意味着如果您需要在禁用元素上进行提示，您可能需要使用一个原生的提示框和 jQuery UI 工具提示框的混合物。
主题化
工具提示框部件（Tooltip Widget）使用 jQuery UI CSS 框架 来定义它的外观和感观的样式。如果需要使用工具提示框指定的样式，则可以使用下面的 CSS class 名称：
ui-tooltip：工具提示框的外层容器。ui-tooltip-content：工具提示框的内容。
依赖
- UI 核心（UI Core）
- 部件库（Widget Factory）
- 定位（Position）
- 特效核心（Effects Core）（可选的；当与
show和hide选项一起使用时）
附加说明
- 该部件要求一些功能性的 CSS，否则将无法工作。如果您创建了一个自定义的主题，请使用小部件指定的 CSS 文件作为起点。
快速导航
Options
- content：tooltip(工具提示框)的内容。当改变这个选项时，你可能还需要更改
items选项。 - disabled：如果设置为
true，则禁用该 tooltip（工具提示框）。 - hide：tooltip(工具提示框)关闭（隐藏）时的动画效果。
- items：一个选择器表示哪些项目应该显示tooltip(工具提示框)。 如果您使用其他的东西自定义，那么title属性将作为tooltip(工具提示框)的内容， 或者你需要一个不同的选择来事件委托。
- position：确定 tooltip(工具提示框) 相对于 相关目标元素的位置。
of选项默认为目标元素， 但您可以指定其他元素来定位。 - show：tooltip(工具提示框) 打开（显示）时的动画效果。
- tooltipClass：一个CSS样式类名 添加到tooltip(工具提示框)小部件， 可用于显示各种提示类型， 像警告或错误。
- track：tooltip(工具提示框)是否应该跟踪（跟随）鼠标。
Methods
- close()：关闭 tooltip(工具提示框) 。这仅供非委派的 tooltip(工具提示框) 调用。
- destroy()：完全移除 tooltip(工具提示框) 功能. 这将使元素返回到之前的初始化状态.
- disable()：禁用 tooltip(工具提示框)。
- enable()：启用 tooltip(工具提示框)。
- open()：以编程方式打开一个 tooltip(工具提示框) 。这仅供非委派的 tooltip(工具提示框) 调用。
- option()：获取当前与指定的
optionName关联的值。 - widget()：返回一个包含 生成包裹元素 的
jQuery对象。
Events
- close( event, ui )：当 tooltip(工具提示框) 关闭时触发，触发事件为
focusout或mouseleave。 - create( event, ui )：在创建tooltip(工具提示框)时触发该事件。
- open( event, ui )：当tooltip(工具提示框)打开，显示时，触发此事件，触发的事件为
focusin或mouseover。
实例
使用带有 title 属性的所有元素的事件代理，在文档上创建一个工具提示框（Tooltip）。
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>工具提示框部件（Tooltip Widget）演示</title> <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css"> <script src="//code.jquery.com/jquery-1.10.2.js"></script> <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script> </head> <body> <p> <a href="#" title="锚描述">锚文本</a> <input title="输入帮助"> </p> <script> $( document ).tooltip(); </script> </body> </html>