编程 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 相关文章推荐

js 禁用浏览器的后退功能的简单方法

Dec 10 Javascript

浏览器常用高宽的jquery插件

Feb 24 Javascript

jQuery中parents()和parent()的区别分析

Oct 28 Javascript

javascript实现tab切换特效

Nov 12 Javascript

jQuery版AJAX简易封装代码

Sep 14 Javascript

jQuery tagsinput在h5邮件客户端中应用详解

Sep 26 Javascript

Angularjs 依赖压缩及自定义过滤器写法

Feb 04 Javascript

js实现做通讯录的索引滑动显示效果和滑动显示锚点效果

Feb 18 Javascript

使用jquery Ajax实现上传附件功能

Oct 23 jQuery

JS实现可用滑块滑动的缓动图代码

Sep 01 Javascript

Javascript Web Worker使用过程解析

Mar 16 Javascript

JS前端监控采集用户行为的N种姿势

Jul 23 Javascript

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/11/16 PHP

PHP中SESSION使用中的一点经验总结

2012/03/30 PHP

php 调用ffmpeg获取视频信息的简单实现

2017/04/03 PHP

PHP合并两个或多个数组的方法

2019/01/20 PHP

JS input文本框禁用右键和复制粘贴功能的代码

2010/04/15 Javascript

js过滤特殊字符输入适合输入、粘贴、拖拽多种情况

2014/03/22 Javascript

FF（火狐）浏览器无法执行window.close()解决方案

2014/11/13 Javascript

jQuery实现Tab菜单滚动切换的方法

2015/09/21 Javascript

AngularJS实用开发技巧(推荐)

2016/07/13 Javascript

关于Javascript回调函数的一个妙用

2016/08/29 Javascript

ajax异步请求详解

2017/01/06 Javascript

vue2滚动条加载更多数据实现代码

2017/01/10 Javascript

Bootstrap table表格简单操作

2017/02/07 Javascript

基于LayUI分页和LayUI laypage分页的使用示例

2017/08/02 Javascript

利用jQuery实现简单的拖曳效果实例代码

2017/10/20 jQuery

[01:57]DOTA2上海特锦赛小组赛解说单车采访花絮

2016/02/27 DOTA

python中的hashlib和base64加密模块使用实例

2014/09/02 Python

Django objects.all()、objects.get()与objects.filter()之间的区别介绍

2017/06/12 Python

在TensorFlow中屏蔽warning的方式

2020/02/04 Python

PyQt使用QPropertyAnimation开发简单动画

2020/04/02 Python

Python批量安装卸载1000个apk的方法

2020/04/10 Python

Django2.1.7 查询数据返回json格式的实现

2020/12/29 Python

canvas实现图片马赛克的示例代码

2018/03/26 HTML / CSS

AHAVA美国官方网站：死海海泥护肤品牌

2016/10/18 全球购物

阿迪达斯希腊官方网上商店：adidas希腊

2019/04/06 全球购物

匡威爱尔兰官网：Converse爱尔兰

2019/06/09 全球购物

自我鉴定的范文

2013/10/03 职场文书

党员廉洁自律承诺书

2014/05/26 职场文书

学校欢迎标语

2014/06/18 职场文书

2014年最新离婚协议书范本

2014/10/11 职场文书

关于运动会的广播稿50字

2014/10/17 职场文书

秋季运动会加油词

2015/07/18 职场文书

python如何在word中存储本地图片

2021/04/07 Python

python3使用diagrams绘制架构图的步骤

2021/04/08 Python

Python数据可视化之基于pyecharts实现的地理图表的绘制

2021/06/10 Python

Python语言中的数据类型-序列

2022/02/24 Python