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带箭头提示框tooltips插件集锦

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款带箭头提示插件的介绍了,小伙伴们使用了没呢?有问题给我留言吧

Javascript 相关文章推荐
JavaScript DOM学习第六章 表单实例
Feb 19 Javascript
JQuery 1.3.2以上版本中出现pareseerror错误的解决方法
Jan 11 Javascript
JavaScript高级程序设计(第3版)学习笔记7 js函数(上)
Oct 11 Javascript
jquery.cookie.js使用指南
Jan 05 Javascript
JavaScript数组各种常见用法实例分析
Aug 04 Javascript
探究Javascript模板引擎mustache.js使用方法
Jan 26 Javascript
jQuery原理系列-css选择器的简单实现
Jun 07 Javascript
详解基于node的前端项目编译时内存溢出问题
Aug 01 Javascript
element ui 对话框el-dialog关闭事件详解
Feb 26 Javascript
vue技术分享之你可能不知道的7个秘密
Apr 09 Javascript
Bootstrap 模态框自定义点击和关闭事件详解
Aug 10 Javascript
layui: layer.open加载窗体时出现遮罩层的解决方法
Sep 26 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
ThinkPHP中__initialize()和类的构造函数__construct()用法分析
2014/11/29 PHP
Zend Framework框架之Zend_Mail实现发送Email邮件验证功能及解决标题乱码的方法
2016/03/21 PHP
JS对象转换为Jquery对象示例
2014/01/26 Javascript
选择复选框按钮置灰否则按钮可用
2014/05/22 Javascript
javascript实现的图片切割多块效果实例
2015/05/07 Javascript
jQuery实现仿美橙互联两级导航菜单效果完整实例
2015/09/17 Javascript
最全面的百度地图JavaScript离线版开发
2016/09/10 Javascript
jQuery实现输入框的放大和缩小功能示例
2018/07/21 jQuery
Vuex 快速入门(简单易懂)
2018/09/20 Javascript
JS 音频可视化插件Wavesurfer.js的使用教程
2018/10/31 Javascript
详解a标签添加onclick事件的几种方式
2019/03/29 Javascript
Vuex持久化插件(vuex-persistedstate)解决刷新数据消失的问题
2019/04/16 Javascript
javascript的this关键字详解
2019/05/20 Javascript
vue把输入框的内容添加到页面的实例讲解
2019/11/11 Javascript
js前端传json后台接收‘‘被转为quot的问题解决
2020/11/12 Javascript
Python获取单个程序CPU使用情况趋势图
2015/03/10 Python
Python文档生成工具pydoc使用介绍
2015/06/02 Python
Python数据分析中Groupby用法之通过字典或Series进行分组的实例
2017/12/08 Python
Python中的上下文管理器和with语句的使用
2018/04/17 Python
python腾讯语音合成实现过程解析
2019/08/01 Python
浅谈pymysql查询语句中带有in时传递参数的问题
2020/06/05 Python
OpenCV 使用imread()函数读取图片的六种正确姿势
2020/07/09 Python
Python+Selenium随机生成手机验证码并检查页面上是否弹出重复手机号码提示框
2020/09/21 Python
Clarisonic美国官网:科莱丽声波洁面仪
2017/10/12 全球购物
J2EE系统只能是基于web
2015/09/08 面试题
政法大学毕业生自荐信范文
2014/01/01 职场文书
毕业晚会主持词
2014/03/24 职场文书
电台编导求职信
2014/05/06 职场文书
国王的演讲观后感
2015/06/03 职场文书
教师网络培训心得体会
2016/01/09 职场文书
2016教师党员学习心得体会
2016/01/21 职场文书
Nginx代理同域名前后端分离项目的完整步骤
2021/03/31 Servers
MySQL root密码的重置方法
2021/04/21 MySQL
通过Qt连接OpenGauss数据库的详细教程
2021/06/23 PostgreSQL
Python标准库pathlib操作目录和文件
2021/11/20 Python
Elasticsearch 基本查询和组合查询
2022/04/19 Python