`
天梯梦
  • 浏览: 13731577 次
  • 性别: Icon_minigender_2
  • 来自: 洛杉矶
社区版块
存档分类
最新评论

15个友好的jQuery 提示框插件

阅读更多

需要在用户把光标移到某个元素上时显示一些额外信息时,提示框是一种不错的方式,提示框会在鼠标停留的时候显示,鼠标移开时消失。

 

适当的使用提示框能大大提升网站的友好度,并且可以节省一些不必要的网页空间,今天我们将看到15款制作友好的提示框的jQuery插件。

 

1. qTip

qTip是一款功能高级的提示框插件,它提供了非常多的特性,包括圆角框、提示泡泡等。


qtip


2. jQuery Tools/Tooltips

这个提示框插件能够显示任何的HTML元素,比如链接、表格、表单、图片,实现这些效果是很轻松的,你也可以轻松制作

出自己独特风格的提示框。

 

jquery-tools-tooltips


3. Simpletip

Simpletip 允许你通过Jquery的元素选择器和事件管理器轻松在任何元素上制作提示框,提示框可以使静态的、动态的、甚至可以通过ajax加载,并且都有非常多不 懂的显示效果。

 

simpletip


4. jQuery (mb)Tooltip

jQuery (mb)Tooltip是一款通过 jQuery timers 和半透明阴影插件实现的漂亮的提示框插件,它为各种需求提供很多可选项。

 

5. EZPZ Tooltip

你不需要添加任何CSS或图片就可以扩展、定制提示框的样式风格。

 

ezpz-tooltip


6. jQuery Input Floating Hint Box

这个插件在表单右边提供一个自动变化的提示框,当输入框获得焦点时它就会显示,失去焦点时就隐藏。

 

iquery-input-floating-hint-box


7. HTML Tooltip

html-tooltip


8. Orbital Tooltip

你可以用 Orbital Tooltip在目标元素的360°任何一个位置制作出一个提示框。

 

orbital-tooltip


9. Tipsy

Facebook风格的提示框插件。


tipsy


10. clueTip

cluetip


11. jTip

jTip 利用 HttpXMLRequest 对象去获取内容,只要在链接上加一个”jTip”class,就可以获取远程地址提供的提示内容

 

jtip


12. BeautyTips

beautytips


13. Hovertips

可扩展性极好,只需少量的javascript代码你就可以制定出自己风格的提示框。

 

 

14. BetterTip

BetterTip基于Cody Lindley的 jTip实现, 但是对比起来它扩展性更好。

 

bettertip


15. jqTooltip

轻松通过ajax制作提示框。


jqtooltip

 

 译自:http://www.webdesignbooth.com/15-jquery-plugins-to-create-an-user-friendly-tooltip/

 

 

分享到:
评论

相关推荐

    jQuery 提示框插件

    jQuery提示框插件是Web开发中的一个实用工具,它扩展了基本的JavaScript功能,使得在网页上创建交互式、美观的提示信息变得简单易行。这些插件通常提供丰富的自定义选项,包括样式、动画效果、位置控制以及与用户...

    简单的jQuery提示框插件

    对于“简单的jQuery提示框插件”,我们可以按照以下步骤进行: 1. **初始化设置**:创建插件时,我们需要先定义一个默认配置对象,包含提示框大小、位置和显示速度等参数。用户可以通过传入自定义配置来覆盖这些...

    jQuery提示框插件.zip

    《jQuery提示框插件深度解析》 在网页开发中,提示框是不可或缺的元素,它用于向用户展示信息、确认操作或提供交互反馈。jQuery,作为一款强大的JavaScript库,为开发者提供了丰富的工具来实现这些功能。本文将深入...

    Tips基于jQuery的提示框插件可自动消失可手动消失

    本文将详细讲解如何使用基于jQuery的Tips插件,该插件允许提示框自动消失或由用户手动消失,从而为用户提供更加友好的交互体验。 首先,我们来了解jQuery Tips插件的基本概念。Tips插件主要用于在网页上显示临时...

    jQuery消息提示框插件点击调用.zip

    首先,"jQuery消息提示框插件点击调用"指的是一个JavaScript插件,它扩展了jQuery的功能,提供了预定义的四种提示框样式:成功提示、失败提示、警告提示和信息提醒。这些提示框通常用于向用户显示操作结果或重要信息...

    jquery-Modal-Plug(jQuery模态框插件)

    **jQuery模态框插件(jquery-Modal-Plug)**是一种用于增强网页交互性的JavaScript工具,它是基于广泛使用的jQuery库构建的。模态框在网页设计中被广泛应用,用于显示弹出式窗口,如警告、确认对话框或者展示详细...

    轻巧的jQuery提示框插件.zip

    《轻巧的jQuery提示框插件深度解析》 在网页开发中,提示框是一种不可或缺的交互元素,用于向用户展示信息、警告或确认操作。jQuery作为一款强大的JavaScript库,为开发者提供了丰富的工具来简化此类任务。本文将...

    jQuery消息提示框插件Tipso.zip

    jQuery Tipso是一款强大的消息提示框插件,专为网页开发者设计,用于提供便捷的提示信息展示功能。在网页交互设计中,提示框是不可或缺的一部分,它能够帮助用户更好地理解和使用网站或应用程序。Tipso插件利用...

    jquery消息提示框插件

    jQuery Tipso是一款高效且易于使用的提示框插件,尤其适合初学者进行页面效果的渲染。这款插件提供了丰富的自定义选项,使得在网页中添加动态提示效果变得轻松快捷。 Tipso的基本使用方法是通过引入jQuery库和Tipso...

    Jquery提示框插件制作用户名片信息提示框代码

    首先,我们需要理解jQuery提示框的基本概念。在jQuery中,`alert()`, `confirm()`, 和 `prompt()` 是内建的对话框函数,但它们的功能有限且样式固定。为了创建自定义的提示框,我们需要利用jQuery的DOM操作和事件...

    jquery alert 提示框、动态加载提示框、jquery插件

    在实际应用中,创建一个jQuery提示框插件可能包括以下步骤: 1. 定义基本结构:封装一个函数,如`$.fn.myAlert = function(options) {...}`,其中`$.fn`是jQuery的prototype,`myAlert`是插件名,`options`是可选...

    jquery提示框小插件

    《jQuery提示框小插件详解》 在网页开发中,用户交互体验的提升往往离不开各种提示信息的恰当展示。jQuery提示框小插件是开发者常用的一种工具,它能帮助我们轻松实现各种类型的提示效果,包括常规提示框和加载框,...

    jQuery多功能提示框插件jBox

    jBox是一款基于jQuery的多功能提示框插件,它包含的功能非常丰富,包括Tooltip提示框、模式弹出窗口等形式。...jBox作为一个jQuery提示框插件,功能上几乎是完美的。你甚至可以用jBox完成一个注册/登录窗口。

    34、jQuery消息提示框插件Tipso

    jQuery Tipso是一款强大的消息提示框插件,它为网页开发者提供了简单而美观的方式来展示提示信息。这个插件基于流行的JavaScript库jQuery构建,旨在增强用户体验,通过动态效果和自定义样式来提升网页交互性。 ...

    jquery提示框插件鼠标悬停显示提示信息

    jquery提示框插件鼠标悬停显示提示信息,非常强大的一款提示信息插件 这是一款比较全面的提示框插件,包含弹出提示框,不同颜色和不同调用方法等。 效果详情可参考http://www.xwcms.net/js/tsk-fdc-dcc/66104.html

    动态带弹性缓冲效果的jQuery提示框插件.zip

    这个"动态带弹性缓冲效果的jQuery提示框插件"是为网页增加交互性和用户体验的一种实用工具。提示框插件通常用于显示通知、警告、错误信息或者进行简单的用户交互。 该插件的核心特性是动态性和弹性缓冲效果。动态性...

    jQuery移动端弹出确认框插件.zip

    在这个"jQuery移动端弹出确认框插件"中,我们可以探讨几个关键的知识点,包括jQuery基础、移动端适配、自定义插件开发以及交互设计。 1. **jQuery基础**:jQuery简化了DOM操作,如选择元素、添加事件监听器和修改...

    JQuery信息提示框插件 jquery.toast.js 的使用

    `jQuery.toast.js` 是一个基于 jQuery 的轻量级信息提示框插件,它提供了一种优雅的方式,用于在网页上显示各种类型的通知、提示信息或者错误消息。这个插件的设计目标是简洁易用,同时具有高度可定制性,能够适应...

Global site tag (gtag.js) - Google Analytics