jQuery UI工具提示

jQuery UI工具提示小部件取代了本机工具提示，因为jQuery UI工具提示允许自定义并添加新主题。

什么是工具提示?

当您将鼠标悬停在元素上时，工具提示会与元素一起使用，以在元素旁边的标题框中显示标题。工具提示可以附加到任何元素。如果要显示工具提示，只需将标题属性添加到输入元素，标题属性值将用作工具提示。

jQueryUI Tooltip有什么作用?

jQuery UI tooltip()方法将工具提示添加到要在其上显示工具提示的任何元素。与仅切换可见性相比，默认情况下，它会提供淡入淡出的动画以显示和隐藏工具提示。

句法：

您可以两种形式使用tooltip()方法。

$(selector, context).tooltip (options) Method

(selector, context).tooltip ("action", [params]) Method

第一种方法

工具提示(选项)方法指定可以将工具提示添加到HTML元素。 options参数是一个对象，它指定工具提示的行为和外观。

句法：

$(selector, context).tooltip(options);

您可以使用Javascript对象一次使用一个或多个选项。如果有多个选项，您将使用逗号将它们分开，如下所示：

$(selector, context).tooltip({option1: value1, option2: value2..... });

以下是可与该方法一起使用的不同选项的列表。

jQuery UI Tooltip()示例1

让我们以一个简单的示例来演示工具提示功能，该工具提示功能不将任何参数传递给tooltip()方法。

What is your comment:


I also have a tooltip

jQueryUI Tooltip()方法示例2

使用职位：

让我们以一个示例来演示jQuery UI工具提示函数中选项位置的用法。

Name:

jQuery UI Tooltip()方法示例3

内容的使用，跟踪和禁用：

以下示例演示了选项内容，跟踪和禁用选项的用法。

Here is the message:




Tooltip is disabled:

第二种方法

工具提示(操作，参数)方法用于对工具提示元素执行操作，例如禁用工具提示。该动作在第一个参数中指定为字符串，并且可以选择地根据给定的动作使用一个或多个参数。

句法：

$(selector, context).tooltip ("action", [params]);

以下是此方法使用的不同操作的列表。

与工具提示元素一起使用的事件方法：

jQueryUI触发特定事件的事件方法。以下是这些事件方法的列表：

jQueryUI Tooltip()方法示例4

让我们以一个示例来演示工具提示功能期间事件方法的用法。下面的示例使用open和close事件。

   
      
      
      
      
      
      
      
   
   
       
      

         Hover over me!

         Hover over me too!