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

2019-12-24,,


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实现网页实时聊天的ajax长轮询
  • JavaScript/jQuery、HTML、CSS 构建 Web IM 远程及时聊天通信程序
  • jQuery在vs2008及js文件中的无智能提示的解决方法
  • JavaScript实现离开页面前提示功能【附jQuery实现方法】
  • Jquery插件分享之气泡形提示控件grumble.js
  • jQuery悬停文字提示框插件jquery.tooltipster.js用法示例【附demo源码下载】
  • jquery.guide.js新版上线操作向导镂空提示jQuery插件(推荐)
  • 基于jquery实现智能提示控件intellSeach.js
  • JS(jQuery)实现聊天接收到消息语言自动提醒功能详解【提示“您有新的消息请注意查收”】

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

下载本文的Word格式文档,以方便收藏与打印。