`
keshin
  • 浏览: 12329 次
  • 性别: Icon_minigender_1
  • 来自: SH.IT
社区版块
存档分类
最新评论

jQuery的tooltip插件

阅读更多

这个插件是参考Mootools1.11版的Tips插件改写的,所以熟悉Mootools的朋友会发现接口和里面的逻辑基本上是一样的,由于本机环境只有ff3和ie7,所以这个插件在其他浏览器环境下是否正常工作不是很清楚。
支持jQuery1.2.6和1.3版本。

附件中包含插件源码、jsDoc以及示例

以下是jsdoc:

jQuery.fn.tips(options ) : jQuery
给指定的元素设置多格式提示
Author: keshin
备注:
元素的title属性总会被作为提示的主内容. 如果你在title中输入 :: ,则 :: 前的内容将被作为提示的标题。 title属性值允许使用html格式.
// 示例:
$("a").tips({offsets:{x:10, y:20}}); // 给所有的链接设置提示
Parameters:
{JSON} options 配置项.可选,默认值如下:
{
    maxTitleChars: 30, // 提示的标题所能显示的最长字数。默认为 30. 
    showDelay: 100,    // 提示显示方法延迟执行的毫秒数 (默认为100 ms)
    hideDelay: 100,    // 提示消失方法延迟执行的毫秒数 (默认为100 ms)
    timeout:  0,       // 提示在显示多长时间后自动小时,0则不会自动小时  
    className: 'tool', //提示所用的样式名的前缀。默认为 ‘tool’.  
                            // 整个提示的样式为: tool-tip 
                            // 提示标题的样式为: tool-title 
                            // 文本内容的样式为: tool-text 
    offsets: {'x': 16, 'y': 16}, // 提示与鼠标的距离。一个包含x/y 属性的对象。
    tipType: 2    // 提示显示的方式,0为显示在元素根据offsets偏移的位置,固定
                            // 1为显示在事件触发时的偏移位置,固定
                            // 2为提示会随鼠标移动
}
Returns:
{jQuery } 可供链式操作

 

分享到:
评论

相关推荐

    jquery tooltip插件示例

    在“jquery tooltip插件示例”的项目中,我们可以看到如何利用 jQuery 和特定的 Tooltip 插件创建出美观且实用的页面效果。这个示例可能包括了各种定制选项,如自定义样式、动态触发事件、不同位置的定位以及内容的...

    Jquery ToolTip插件

    jQuery ToolTip插件是一种在网页交互中常用的辅助功能,它能为页面元素提供额外的信息提示。这个插件基于流行的JavaScript库jQuery,使得在网页上创建动态、可自定义的提示框变得极其简单。通过给HTML元素添加`title...

    jquery tooltip插件

    jQuery Tooltip插件是一种在网页上实现提示信息的工具,它基于流行的JavaScript库jQuery构建,旨在为用户提供简单且灵活的方式来展示动态或静态的信息。这个插件的设计理念是方便开发者快速集成到他们的项目中,以...

    Protip | 功能强大的jQuery Tooltip插件

    Protip是一款功能强大的jQuery Tooltip插件。它提供众多的参数和方法来控制Tooltip,可以在49个位置上显示Tooltip,并且可以和animate.css配合制作各种Tooltip过渡动画效果。

    jquery Tooltip简易文本提示框插件

    要使用jQuery Tooltip,首先确保已在项目中引入jQuery库,然后可以通过以下方式引入jQuery Tooltip插件的JS和CSS文件: ```html <!-- 引入jQuery --> <script src="https://code.jquery....

    jQuery tooltip 提示插件

    在jQuery的基础上开发的Tooltip插件,可以方便地集成到任何基于jQuery的项目中,为用户提供更直观的信息展示方式。 在描述中提到,这款jQuery Tooltip插件特别之处在于它支持通过AJAX动态加载提示内容。这意味着...

    Protip是一款功能强大的jQueryTooltip插件

    Protip是一款功能强大的jQuery Tooltip插件。它提供众多的参数和方法来控制Tooltip,可以在49个位置上显示Tooltip,并且可以和animate.css配合制作各种Tooltip过渡动画效果。

    jquery tooltip在表格中的使用

    jQuery Tooltip 是一个非常实用的插件,用于在用户将鼠标悬停在元素上时显示相关信息。在表格中使用 jQuery Tooltip 可以增强用户体验,让用户在不离开当前视图的情况下获取额外的数据或说明。本教程将深入讲解如何...

    jQuery Tooltip

    jQuery Tooltip 是一个基于 jQuery 库的插件,用于在网页元素上显示提示信息。这个插件可以帮助开发者创建具有自定义样式、动态效果和交互性的工具提示。jQuery 的流行在于其简洁的API和丰富的插件库,jQuery ...

    基于bootstrap 3的jQuery tooltip提示插件

    ggtooltip.js是一款非常实用的基于bootstrap 3.X的jQuery tooltip提示插件。该bootstrap jQuery tooltip插件实用简单,支持在4个方向上像素tooltip信息,支持修改tooltip的背景色、前景色和边框颜色。

    Jquery Tooltip 提示框

    2. **poshytip-1.2**: PoshyTip是一个轻量级且高度可定制的jQuery Tooltip插件,它提供了丰富的选项和方法来控制提示框的外观和行为。例如,你可以设置提示的位置(如上方、下方、左方或右方),颜色,透明度,以及...

    jQuery简单实用的tooltip插件

    这是一款简单实用的jQuery tooltip插件。该tooltip插件提供很多参数让你可以控制tooltip的位置、大小、内容和动画等属性,并且还可以设置tooltip的倒计时消失效果,既简单有非常的实用。

    jQuery Tooltip跟随鼠标提示条

    jQuery Tooltip插件则是利用jQuery的灵活性和易用性来实现这一功能,允许开发者轻松地为网页元素添加动态提示效果。 在描述中提到的"处于四个角落时,自动变换位置",意味着这个jQuery Tooltip插件具有智能定位功能...

    jQuery plugin: Tooltip(转)

    jQuery的Tooltip插件是实现这种功能的一种便捷方式。本文将深入探讨jQuery Tooltip插件的原理、实现方法以及如何自定义样式和行为。 首先,让我们理解Tooltip的基本概念。Tooltip通常是一个小型的弹出框,显示与...

    jquery tooltip

    Tooltip插件利用jQuery的强大功能,为开发者提供了一种方便的方式,来创建美观、动态的提示效果,而无需编写大量的自定义代码。 使用jQuery Tooltip插件的基本步骤如下: 1. **引入依赖**:首先,在HTML文件中引入...

    JQuery-Tooltip-Plugin

    《jQuery Tooltip 插件详解与应用实践》 在Web开发中,Tooltip是一种常见的交互元素,它可以在鼠标悬停在特定元素上时显示额外的信息。jQuery作为一款强大的JavaScript库,提供了丰富的插件来增强这种功能,其中之...

    25个优雅的jQuery Tooltip插件推荐

    jQuery Tooltip插件是一种用于在网页上提供额外信息的交互式元素,它可以帮助用户理解页面上的特定元素或功能,提升用户体验。这些插件通常基于jQuery库,一个轻量级且强大的JavaScript库,使得创建动态和响应式的...

    jQuery Tooltip提示框插件实现气泡提示工具栏特效源码.zip

    2. **引入Tooltip插件**:接着,需要引入Tooltip插件的脚本文件,这通常在jQuery库之后引入。如果资源包含此文件,其名为"132686916672962803.js",应确保正确引用。 3. **创建提示框样式**:在CSS文件中定义...

    效果非常棒的tooltip插件

    下面我们将深入探讨Tooltip插件的核心概念、功能以及如何使用这个特定的jQuery Tooltip插件。 【核心知识点】 1. **Tooltip的基本概念**:Tooltip是一种小型的HTML元素,通常以气泡形式出现,用于在鼠标悬停时显示...

Global site tag (gtag.js) - Google Analytics