近期,由于项目需要,使用到气泡提示的效果。在网上搜索了一下,找到qTip插件,该插件功能强大,兼容性好,文档齐全。个人比较喜欢
官方网址:http://craigsworks.com/projects/qtip/
,附件中也有!
下面是我个人使用总结
- 当内容是来自另外一个页面时,宽度(width)应取决于页面的宽度,也就是说width应设为100%,一开始设置错了。name:'blue'是使用内嵌的css样式:blue
错误的例子:
style: { width: 100%,name:'blue'}
正确的例子:
style: {width: '100%',name:'blue'}
注意两个例子,正确的例子是要加''括号的。
- 当浏览器不是最大化时,浏览器的宽度和高度会影响气泡提示的效果,这时就要让气泡的位置随着浏览的变化而变化,这时应该如下设置:
position: {adjust: { resize: true,screen: true }}
resize属性是告诉气泡随浏览器的变化而变化,screen属性告诉气泡如果上边的位置不够时,自动调整在下边显示,如果左边位置不够时自动调整在右边显示。
暂时写到这里,如果遇到一些问题继续更新
分享到:
相关推荐
qTip2 精致的jQuery提示信息插件
qTip是一个基于JQuery的Tooltip插件。它几乎支持所有的主流浏览器。
JQuery的前端气泡插件,包括js工具类及详细的使用实例,有注详细的注释
jquery qtip
主要介绍了jQuery提示插件qTip2用法,结合实例形式分析了qTip2的使用技巧,可支持ajax及多种样式的设置,需要的朋友可以参考下
提示未功能,包括样式 位置 事件都可以 由自己定义 。。。很强很方便。。
jQuery qtip浮动提示框插件新浪微博图片或文字ajax提示
jquery-qtip,提示框。 使用很方便
qTip是一个实现圆角对话气泡框样式的Tooltip jQuery插件。支持多种浏览器,可定制,功能强大。
jquery.qtip-1.0.0-rc3.js 弹出层
jQuery qtip浮动提示框插件新浪微博图片或文字ajax提示框
主要介绍了jquery.qtip提示信息插件用法,结合简单实例形式分析了该插件用于显示提示信息的相关使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下
qTip2是一个灰常强大且精致的jQuery提示信息插件,是qTip的第2版,也是一个全新的版本,提供了丰富的功能及漂亮的外观,非常易于使用
qTip2是一个灰常强大且精致的jQuery提示信息插件,是qTip的第2版,也是一个全新的版本,提供了丰富的功能及漂亮的外观,非常易于使用。
NULL 博文链接:https://hcty31.iteye.com/blog/1187482
Jquery实现自动化表单验证,qTip作提示媒介,以留言模版做实例,验证简洁可通用化
前端项目-qtip2,介绍…第2季度。第二代高级qtip插件,用于流行的jquery框架。
[removed][removed] 导入即可使用jquery提示功能