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 相关文章推荐
学习JavaScript的最佳方法分享
Oct 21 Javascript
Javascript基础教程之break和continue语句
Jan 18 Javascript
jquery不常用方法汇总
Jul 26 Javascript
jquery解析json格式数据的方法(对象、字符串)
Nov 24 Javascript
jQuery实现图片文字淡入淡出效果
Dec 21 Javascript
Jquery循环截取字符串的方法(多出的字符串处理成"...")
Nov 28 Javascript
详解extract-text-webpack-plugin 的使用及安装
Jun 12 Javascript
vue 登录滑动验证实现代码
Aug 24 Javascript
jQuery利用FormData上传文件实现批量上传
Dec 04 jQuery
JavaScript组合模式---引入案例分析
May 23 Javascript
Bootstrap告警框(alert)实现弹出效果和短暂显示后上浮消失的示例代码
Aug 27 Javascript
js实现简单的点名器随机色实例代码
Sep 20 Javascript
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文本操作类
2006/11/25 PHP
php date与gmdate的获取日期的区别
2010/02/08 PHP
php求数组全排列,元素所有组合的方法
2016/05/05 PHP
PHP获取访问页面HTTP状态码的实现代码
2016/11/03 PHP
PHP+redis实现的悲观锁机制示例
2018/06/12 PHP
用javascript getComputedStyle获取和设置style的原理
2008/10/10 Javascript
解决表单中第一个非隐藏的元素获得焦点的一个方案
2009/10/26 Javascript
IE6下通过a标签点击切换图片的问题
2010/11/14 Javascript
一个挺有意思的Javascript小问题说明
2011/09/26 Javascript
ajax上传时参数提交不更新等相关问题
2012/12/11 Javascript
ExtJs设置GridPanel表格文本垂直居中示例
2013/07/15 Javascript
基于jQuery和hwSlider实现内容左右滑动切换效果附源码下载(一)
2016/06/22 Javascript
AngularJs Understanding the Model Component
2016/09/02 Javascript
深入理解JS中的Function.prototype.bind()方法
2016/10/11 Javascript
js仿拉勾网首页穿墙广告效果
2017/03/08 Javascript
JavaScript简单计算人的年龄示例
2017/04/15 Javascript
实现jquery放大镜的两种方法
2018/02/22 jQuery
详解JS实现系统登录页的登录和验证
2019/04/29 Javascript
vue路由守卫+登录态管理实例分析
2019/05/21 Javascript
基于vue实现一个禅道主页拖拽效果
2019/05/27 Javascript
详解NodeJs项目 CentOs linux服务器线上部署
2019/09/16 NodeJs
小程序使用wxs解决wxml保留2位小数问题
2019/12/13 Javascript
VUE使用 wx-open-launch-app 组件开发微信打开APP功能
2020/08/11 Javascript
Python实现根据指定端口探测服务器/模块部署的方法
2014/08/25 Python
Python函数式编程指南(二):从函数开始
2015/06/24 Python
轻松掌握python设计模式之访问者模式
2016/11/18 Python
python动态视频下载器的实现方法
2019/09/16 Python
用python按照图像灰度值统计并筛选图片的操作(PIL,shutil,os)
2020/06/04 Python
Win10下配置tensorflow-gpu的详细教程(无VS2015/2017)
2020/07/14 Python
Python 在局部变量域中执行代码
2020/08/07 Python
新西兰网上购物,折扣店:BestDeals.co.nz
2019/03/20 全球购物
澳大利亚墨水站Ink Station:墨水和碳粉打印机墨盒
2019/03/24 全球购物
丽笙酒店官方网站:Radisson Hotels
2019/05/07 全球购物
C#里面如何判断一个Object是否是某种类型(如Boolean)?
2016/02/10 面试题
网络技术专业求职信
2014/05/02 职场文书
2014年电教工作总结
2014/12/19 职场文书