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 相关文章推荐
jQuery 源码分析笔记(4) Ready函数
Jun 02 Javascript
Js保留小数点的4种效果实现代码分享
Apr 12 Javascript
使用AngularJS编写较为优美的JavaScript代码指南
Jun 19 Javascript
深入理解逻辑表达式的用法 与或非的用法
Jun 06 Javascript
jQuery is not defined 错误原因与解决方法小结
Mar 19 Javascript
Vue2.0 UI框架ElementUI使用方法详解
Apr 14 Javascript
详解windows下vue-cli及webpack 构建网站(二)导入bootstrap样式
Jun 17 Javascript
Vue props 单向数据流的实现
Nov 06 Javascript
三步实现ionic3点击退出app程序
Sep 17 Javascript
Vue3为什么这么快
Sep 23 Javascript
vue中配置scss全局变量的步骤
Dec 28 Vue.js
JS+CSS实现动态时钟
Feb 19 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
Ajax PHP 边学边练 之三 数据库
2009/11/26 PHP
PHP XML数据解析代码
2010/05/26 PHP
php简单计算页面加载时间的方法
2015/06/19 PHP
PHPWind9.0手动屏蔽验证码解决后台关闭验证码但是依然显示的问题
2016/08/12 PHP
php实现的SSO单点登录系统接入功能示例分析
2016/10/12 PHP
jquery插件jbox使用iframe关闭问题
2009/02/09 Javascript
jquery获取焦点和失去焦点事件代码
2013/04/21 Javascript
jquery实现动态菜单的实例代码
2013/11/28 Javascript
JavaScript  cookie 跨域访问之广告推广
2016/04/20 Javascript
jQuery 中的 DOM 操作
2016/04/26 Javascript
JS中split()用法(将字符串按指定符号分割成数组)
2016/10/24 Javascript
JS中用childNodes获取子元素换行会产生一个子元素
2016/12/08 Javascript
Jquery Easyui验证组件ValidateBox使用详解(20)
2016/12/18 Javascript
简单实现js悬浮导航效果
2017/02/05 Javascript
bootstrap vue.js实现tab效果
2017/02/07 Javascript
js实现文字无缝向上滚动
2017/02/16 Javascript
JS运动改变单物体透明度的方法分析
2018/01/23 Javascript
vue中Axios的封装与API接口的管理详解
2018/08/09 Javascript
Vue 实现一个简单的鼠标拖拽滚动效果插件
2020/12/10 Vue.js
python获取元素在数组中索引号的方法
2015/07/15 Python
python中日志logging模块的性能及多进程详解
2017/07/18 Python
flask框架中勾子函数的使用详解
2018/08/01 Python
wxpython绘制圆角窗体
2019/11/18 Python
Python新手学习标准库模块命名
2020/05/29 Python
Python基于正则表达式实现计算器功能
2020/07/13 Python
工厂厂长岗位职责
2013/11/08 职场文书
大学生实习思想汇报
2014/01/12 职场文书
跟单业务员岗位职责
2014/03/08 职场文书
小学校长竞聘演讲稿
2014/05/16 职场文书
学雷锋活动总结报告
2014/06/26 职场文书
学校与家长安全责任书
2014/07/23 职场文书
开展党的群众路线教育实践活动情况汇报
2014/11/05 职场文书
小学生思想品德评语
2014/12/31 职场文书
离婚代理词范文
2015/05/23 职场文书
解决goland 导入项目后import里的包报红问题
2021/05/06 Golang
利用Matlab绘制各类特殊图形的实例代码
2021/07/16 Python