编程 Javascript

jQuery带箭头提示框tooltips插件集锦

Posted in Javascript onNovember 17, 2014

摘要：

之前给大家介绍过用CSS来实现带箭头的提示框，今天我们来点不太一样的，本文将分享几款带箭头提示框。

qtip
qTip是一种先进的提示插件，基于jQuery框架。以用户友好，而且功能丰富，qTip为您提供不一般的功能，如圆角和语音气泡提示，并且最重要的是免费。支持ie6+以及其他主流浏览器
jQuery带箭头提示框tooltips插件集锦

grumble.js
grumble.js提供了特殊的提示，北/东/南/西定位的一般限制。可以围绕一个给定的元素以任意角度旋转，任何距离可以被指定，任何CSS样式可以应用。自动尺寸调整为本地化的文本使用。
jQuery带箭头提示框tooltips插件集锦

cluetip
clueTip插件可以让你轻松展现出奇特的工具提示，当用户的鼠标悬停在（或可选点击）你的脚本中指定的任何元素。如果该元素包含一个title属性，它的文本成为clueTip的标题。
jQuery带箭头提示框tooltips插件集锦

qtip2
qtip2是第二代先进的qTip插件,基于jQuery框架。支持ie6+以及其他主流浏览器。
jQuery带箭头提示框tooltips插件集锦

jtooltip
jQuery-ui提供的tooltip
jQuery带箭头提示框tooltips插件集锦

powertip
powertip采用了非常灵活的设计，易于定制，为您提供了多种不同的方法来使用工具提示，有API的开发人员，并支持添加复杂的数据提示。它正在积极地开发和维护，并提供了非常流畅的用户体验。
jQuery带箭头提示框tooltips插件集锦

colortip
转换元素的标题属性值，变成了一系列丰富多彩的工具提示。六种颜色主题可供选择，让您可以在您的设计的其余部分很容易匹配。
jQuery带箭头提示框tooltips插件集锦 tipsy
tipsy是一个jQuery插件，用于创建基于一个锚标记的title属性类似于Facebook的工具提示效果。

jQuery-tooltip

jQuery带箭头提示框tooltips插件集锦 floatabels

jQuery带箭头提示框tooltips插件集锦 Bootstrap

Popover
Popover用于当用户点击任何原件的子元素显示信息。
jQuery带箭头提示框tooltips插件集锦

sweet
sweet工具提示是一个jQuery和CSS3的基础工具提示，不只是一个风格的提示，这种无意象工具提示使用CSS线性渐变，盒阴影，文字阴影制作。
jQuery带箭头提示框tooltips插件集锦

tooltipster
一个强大，灵活的jQuery插件使您能够轻松地创建具有增强CSS的强大的语义，现代化的工具提示。支持ie8+以及其他主流浏览器
jQuery带箭头提示框tooltips插件集锦

darktooltip
一个简单的自定义工具提示与确认方案和效果。
jQuery带箭头提示框tooltips插件集锦

jCallout
易于使用和实施，只有CSS JQuery的实现（无需图像），可自定义的选项。
jQuery带箭头提示框tooltips插件集锦

小结：

在这几款提示插件中，个人最细化的有sweet、tooltipster、grumble。因为他们样式非常的好看。

以上就是这13款带箭头提示插件的介绍了，小伙伴们使用了没呢？有问题给我留言吧

jQuery带箭头提示框tooltips插件集锦

- Author -

hebedich

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

jquery插件如何使用 jQuery操作Cookie插件使用介绍

Dec 15 Javascript

jQuery不间断滚动效果(模拟百度新闻支持文字/图片/垂直滚动)

Feb 05 Javascript

基于JavaScript如何实现ajax调用后台定义的方法

Dec 29 Javascript

javascript正则表达式之分组概念与用法实例

Jun 16 Javascript

ECMAScript6变量的解构赋值实例详解

Sep 19 Javascript

JQ图片文件上传之前预览功能的简单实例(分享)

Nov 12 Javascript

在 Node.js 中使用 async 函数的方法

Nov 17 Javascript

Gulp实现静态网页模块化的方法详解

Jan 09 Javascript

[原创]jQuery实现合并/追加数组并去除重复项的方法

Apr 11 jQuery

基于JS实现带动画效果的流程进度条

Jun 01 Javascript

详解vue数组遍历方法forEach和map的原理解析和实际应用

Nov 15 Javascript

vue使用wavesurfer.js解决音频可视化播放问题

Apr 04 Vue.js

JavaScript实现的内存数据库LokiJS介绍和入门实例

Nov 17 #Javascript

浅谈jQuery异步对象（XMLHttpRequest）

Nov 17 #Javascript

node.js中watch机制详解

Nov 17 #Javascript

z-blog SyntaxHighlighter 长代码无法换行解决办法(jquery)

Nov 16 #Javascript

js构造函数、索引数组和属性的实现方式和使用

Nov 16 #Javascript

JQuery表单验证插件EasyValidator用法分析

Nov 15 #Javascript

不到30行JS代码实现Excel表格的方法

Nov 15 #Javascript

You might like

桌面中心(三)修改数据库

2006/10/09 PHP

php strrpos()与strripos()函数

2013/08/31 PHP

通过ifame指向的页面高度调整iframe的高度

2006/10/05 Javascript

用正则xmlHttp实现的偷(转)

2007/01/22 Javascript

Javascript Math ceil()、floor()、round()三个函数的区别

2010/03/09 Javascript

纯JavaScript实现的完美渐变弹出层效果代码

2010/04/02 Javascript

JS实现单行文字不间断向上滚动的方法

2015/01/29 Javascript

javascript中in运算符用法分析

2015/04/28 Javascript

简单实现jQuery进度条轮播实例代码

2016/06/20 Javascript

深入浅析JS Function()构造函数

2016/08/22 Javascript

购物车前端开发（jQuery和bootstrap3）

2016/08/27 Javascript

node.js学习之断言assert的使用示例

2017/09/28 Javascript

bootstrap fileinput插件实现预览上传照片功能

2018/01/23 Javascript

JS逻辑运算符短路操作实例分析

2018/07/09 Javascript

Vue导出页面为PDF格式的实现思路

2018/07/31 Javascript

Vue-router 切换组件页面时进入进出动画方法

2018/09/01 Javascript

说说Vuex的getters属性的具体用法

2019/04/15 Javascript

解决LayUI加上form.render()下拉框和单选以及复选框不出来的问题

2019/09/27 Javascript

JS使用Chrome浏览器实现调试线上代码

2020/07/23 Javascript

[01:30:15]DOTA2-DPC中国联赛正赛 Ehome vs Aster BO3 第二场 2月2日

2021/03/11 DOTA

Python实现的飞速中文网小说下载脚本

2015/04/23 Python

python 集合并集、交集 Series list set 转换的实例

2018/05/29 Python

如何用Python实现简单的Markdown转换器

2018/07/16 Python

python实现贪吃蛇游戏

2020/03/21 Python

html5的canvas实现3d雪花飘舞效果

2013/12/27 HTML / CSS

【HTML5】Canvas绘制简单图片教程

2016/05/13 HTML / CSS

美特斯邦威官方商城：邦购网

2016/10/13 全球购物

台湾良兴购物网：EcLife

2019/12/01 全球购物

结构和类有什么异同

2012/07/16 面试题

如何写一个自定义标签

2012/12/28 面试题

三年级数学教学反思

2014/01/31 职场文书

2014年连锁店圣诞节活动方案

2014/12/09 职场文书

创先争优承诺书

2015/01/20 职场文书

投标邀请书范本

2015/02/02 职场文书

2015驻村干部工作总结

2015/04/07 职场文书

创业计划书之校园超市

2019/09/12 职场文书