好库网 好库网首页 | 我的好库
JQuery入门

Tooltip(settings)-JQuery API

发布者:jquery2000
发布日期:2011/4/6 16:37:44   更新日期:2011/4/6 16:37:44
阅读次数:2413
评分:4.80
介绍:Tooltip(settings) 为选择的元素显示自定义工具提示代替默认的提示。
正文:

Tooltip(settings)

为选择的元素显示自定义工具提示代替默认的提示。

The tooltip behaviour mimics the default one, but lets you style the tooltip and specify the delay before displaying it. In addition, it displays the href value, if it is available. To style the tooltip, use these selectors in your stylesheet: #tooltip - The tooltip container #tooltip h3 - The tooltip title #tooltip p.body - The tooltip body, shown when using showBody #tooltip p.url - The tooltip url, shown when using showURL

 

返回值

jQuery

 

参数

settings (Object): (optional) Customize your Tooltips 

Hash 选项

delay (Number): The number of milliseconds before a tooltip is display, default is 250 

event (String): The event on which the tooltip is displayed, default is "mouseover", "click" works fine, too 

track (Boolean): If true, let the tooltip track the mousemovement, default is false 

showURL (Boolean): If true, shows the href or src attribute within p.url, default is true 

showBody (String): If specified, uses the String to split the title, displaying the first part in the h3 tag, all following in the p.body tag, separated with <br/>s, default is null 

extraClass (String): If specified, adds the class to the tooltip helper, default is null 

fixPNG (Boolean): If true, fixes transparent PNGs in IE, default is false 

示例

说明:

Shows tooltips for anchors, inputs and images, if they have a title

 

jQuery 代码:

$('a, input, img').Tooltip(); 

--------------------------------------------------------------------------------

 

说明:

Shows tooltips for labels with no delay, tracking mousemovement, displaying the tooltip when the label is clicked.

 

jQuery 代码:

$('label').Tooltip({ delay: 0, track: true, event: "click" }); 

--------------------------------------------------------------------------------

 

说明:

This example starts with modifying the global settings, applying them to all following Tooltips; Afterwards, Tooltips for anchors with class pretty are created with an extra class for the Tooltip: "fancy" for anchors, "fancy-img" for images

 

jQuery 代码:

// modify global settings $.extend($.fn.Tooltip.defaults, { track: true, delay: 0, showURL: false, showBody: " - ", fixPNG: true }); // setup fancy tooltips $('a.pretty').Tooltip({ extraClass: "fancy" }); $('img.pretty').Tooltip({ extraClass: "fancy-img", });


评论 [发表评论]
账号 密码 还没帐号呢,现在注册一个?

免责声明:好库网所展示的信息由买卖双方自行提供,其真实性、准确性和合法性由信息发布人负责。好库网不提供任何保证,并不承担任何法律责任。