jquery.cvtooltip.js 基于jquery的气泡提示插件


Posted in Javascript onNovember 19, 2010


1.插件名cvtooltip中的cv是ChinaValue的首字母缩写,而tooltip就是提示啦。
2.适用于新功能的提示,引导用户的提示,即时类消息的提示,操作失败提示(操作成功了也没人拦着)等等等,使用css实现,不附带任何图片文件。
3.目前发现的问题,在Chorme中表现的不给力,是由于Chrome对页面的解析与IE和FF不同,导致jquery的position或者offset返回值不同。
4.该插件依然是练习之作,一人之力,错误难免。

实例演示
1.载入页面的同时,气泡提示也显示。请将目光移至第一段。
2.点击按钮后显示气泡提示,注意,该提示不能被关闭,两秒后自动消失消失失失。 我是链接
3.关闭气泡动作后调用关闭函数。 再次点我

参数
panel: "body", //该参数是加载气泡提示的容器,值不同可能会导致计算的位置不同
selector: "", //用于计算定位的控件
direction: 0, //箭头方向
width: 300, //气泡提示宽度,完全手动设置
left: 0, //距离panel参数的左边距
top: 0, //距离panel参数的上边距
delay: -1, //延迟关闭,单位毫秒,值为0时表示立刻关闭
speed: 300, //关闭时的效果,淡出速度
close: true, //是否显示关闭按钮
callback: function() {
$.noop(); //点击关闭后的事件
}

用法和源码
这个就不贴了,查看下页面源文件就行啦,在JS中也写得灰常清楚鸟,或者猛点这里下载。

皮奈斯
显示气泡提示的前提是,一定会有一个被提示的对象,默认的位置是根据body来计算的,这样的坏处就是如果页面内容发生了变化,而气泡的位置没有改变,导致提示目的失败。
针对此情况,提供了selector参数来保证气泡随着该选择器控件的位置改变而发生改变。
js文件打包下载
原文地址 http://www.cnblogs.com/0417/archive/2010/11/17/1880293.html

Javascript 相关文章推荐
SOSO地图API使用(一)在地图上画圆实现思路与代码
Jan 15 Javascript
JavaScript中创建对象和继承示例解读
Feb 12 Javascript
jquery删除数据记录时的弹出提示效果
May 06 Javascript
JavaScript模拟可展开、拖动与关闭的聊天窗口实例
May 12 Javascript
Angular 中 select指令用法详解
Sep 29 Javascript
jQuery中on方法使用注意事项详解
Feb 15 Javascript
微信小程序 wx.login解密出现乱码的问题解决办法
Mar 10 Javascript
JavaScript实现二叉树的先序、中序及后序遍历方法详解
Oct 26 Javascript
详解webpack babel的配置
Jan 09 Javascript
JavaScript引用类型Array实例分析
Jul 24 Javascript
从0到1学习JavaScript编写贪吃蛇游戏
Jul 28 Javascript
Vue实现导入Excel功能步骤详解
Jul 03 Vue.js
jQuery lazyload 的重复加载错误以及修复方法
Nov 19 #Javascript
JQuery 选择和过滤方法代码总结
Nov 19 #Javascript
基于jquery的一个OutlookBar类,动态创建导航条
Nov 19 #Javascript
非阻塞动态加载javascript广告实现代码
Nov 17 #Javascript
javascript实现的使用方向键控制光标在table单元格中切换
Nov 17 #Javascript
Google AJAX 搜索 API实现代码
Nov 17 #Javascript
jQuery阻止冒泡和HTML默认操作
Nov 17 #Javascript
You might like
批量去除PHP文件中bom的PHP代码
2012/03/13 PHP
PHP SPL使用方法和他的威力
2013/11/12 PHP
Zend Framework教程之Zend_Db_Table用法详解
2016/03/21 PHP
javascript Zifa FormValid 0.1表单验证 代码打包下载
2007/06/08 Javascript
js汉字排序问题 支持中英文混排,兼容各浏览器,包括CHROME
2011/12/20 Javascript
jQuery插件windowScroll实现单屏滚动特效
2015/07/14 Javascript
jQuery实现带分组数据的Table表头排序实例分析
2015/11/24 Javascript
HTML5 JS压缩图片并获取图片BASE64编码上传
2020/11/16 Javascript
codeMirror插件使用讲解
2017/01/16 Javascript
微信小程序实战之运维小项目
2017/01/17 Javascript
又一款MVVM组件 构建自己的Vue组件(2)
2017/03/13 Javascript
基于jQuery实现的单行公告活动轮播效果
2017/08/23 jQuery
深入浅析Vue.js中 computed和methods不同机制
2018/03/22 Javascript
vue2.0使用v-for循环制作多级嵌套菜单栏
2018/06/25 Javascript
vue项目打包后请求地址错误/打包后跨域操作
2020/11/04 Javascript
[51:29]Alliance vs TNC 2019国际邀请赛小组赛 BO2 第二场 8.16
2019/08/18 DOTA
python技能之数据导出excel的实例代码
2017/08/11 Python
numpy实现合并多维矩阵、list的扩展方法
2018/05/08 Python
python安装scipy的方法步骤
2019/06/26 Python
python实现LBP方法提取图像纹理特征实现分类的步骤
2019/07/11 Python
python 控制Asterisk AMI接口外呼电话的例子
2019/08/08 Python
解决Python设置函数调用超时,进程卡住的问题
2019/08/08 Python
python队列原理及实现方法示例
2019/11/27 Python
pytorch 中pad函数toch.nn.functional.pad()的用法
2020/01/08 Python
HTML5对手机页面长按会粘贴复制禁用的解决方法
2016/07/19 HTML / CSS
英国家电直销:Appliances Direct
2016/09/22 全球购物
KIKO MILANO荷兰网上商店:意大利专业化妆品品牌
2017/05/12 全球购物
您在慕尼黑的跑步商店:Lauf-bar
2019/10/11 全球购物
工厂门卫岗位职责
2013/11/25 职场文书
自我评价范文
2013/12/22 职场文书
自我反省检讨书
2014/01/23 职场文书
测试工程师职业规划书
2014/02/06 职场文书
活动宣传策划方案
2014/05/23 职场文书
2015年高中班主任工作总结
2015/04/30 职场文书
JavaScript实现队列结构过程
2021/12/06 Javascript
Element-ui Layout布局(Row和Col组件)的实现
2021/12/06 Vue.js