WebUI Popover是一个轻量级的jQuery弹出信息插件，配合Bootstrap使用，能制作一些很棒的新功能效果，他的使用可以和Bootstrap结合，但是没有Bootstrap也能使用，依赖jQuery插件版本1.7+以上。
WebUI Popover轻量级的jQuery弹出信息插
兼容性
WebUI Popover能完美兼容以下浏览器中的显示效果
ie8+
Chrome
Safari
Firefox
Opera
使用方法
引入插件的文件
jquery.webui-popover.css">
...
<script src="jquery.js"></script>
<script src="jquery.webui-popover.js"></script>
使用插件
$("a").webuiPopover(options);
一些使用的例
创建简单的Popover
$("a").webuiPopover({title:"Title",content:"Content"});
创建Popover，通过DOM自定义属性设置弹出内容的值
$("a").webuiPopover();
在底部弹出窗口
$("a").webuiPopover({title:"Title",content:"Content",placement:"bottom"});
特征
快速，轻量级
支持更多的位置
自动计算的位置
关闭弹出按钮
在同一页多的弹出
不同的风格
支持URL和iframe
支持异步模式
默认选项
{
placement:"auto",//values: auto,top,right,bottom,left,top-right,top-left,bottom-right,bottom-left
width:"auto",//can be set with number
height:"auto",//can be set with number
trigger:"click",//values:click,hover
style:"",//values:"",inverse
constrains:null, // constrains the direction when placement is auto, values: horizontal,vertical
animation:null, //pop with animation,values: pop,fade (only take effect in the browser which support css3 transition)
delay: {//show and hide delay time of the popover, works only when trigger is "hover",the value can be number or object
show: null,
hide: 300
},
async: {
before: function(that, xhr) {},//executed before ajax request
success: function(that, data) {}//executed after successful ajax request
},
cache:true,//if cache is set to false,popover will destroy and recreate
multi:false,//allow other popovers in page at same time
arrow:true,//show arrow or not
title:"",//the popover title ,if title is set to empty string,title bar will auto hide
content:"",//content of the popover,content can be function
closeable:false,//display close button or not
padding:true,//content padding
type:"html",//content type, values:"html","iframe","async"
url:""//if not empty ,plugin will load content by url
}
【jquery弹出提示框】jQuery弹出信息插件WebUI Popover使用教程
http://m.bbyears.com/wangyezhizuo/68442.html
推荐访问:jquery插件库 jquery加密解密插件