jQuery弹出层插件popbox
都什么年代了,还自己写弹出层插件!是的,①自己写的自己好控制②可定制性高③兼容低版本IE
本插件有以下特性:
- 样式分离,可定制,纯净无图片
- 可自定义按钮及按钮的样式、点击事件
- 可指定选择器选择页面元素的内容作为弹出层的内容,也可以指定url来异步加载单独页面
- 可配置遮罩层、关闭按钮、按钮栏
- 可配置拖动、自动关闭、失焦关闭
- 可配置打开、关闭和确定、取消时的动作
先上一张截图看看样子:

使用方法:
1. 引入相关文件
<link rel="stylesheet" href="jquery.popbox.css" />
<script src="jquery.min.js"></script>
<script src="jquery.popbox.js"></script>
2. 调用$.popbox();默认配置参数如下:
var defaults = {
width : '666px',
maxHeight : '500px', //body区域的最大高度
padding : '20px', //body区域的padding值
title : '温馨提示', //标题
content : '', //主体内容,支持HTML标签
contentSelector : '', //加载选择器指定的元素的内容
contentUrl : '', //通过ajax加载单独的页面
foot : '', //底部内容
showMask : true, //是否显示遮罩层
showCloseBtn : true, //是否显示关闭按钮
btns : [
{
type : 'ok',
text : '确定',
click : null
},
{
type : 'cancel',
text : '取消',
click : null
}
], //默认显示的按钮,
draggable : true, //是否可拖动
autoClose : 0, //是否自动关闭,否则设为0,是则设为大于0的数字,表示关闭时间,单位ms
blurClose : false, //点击窗口外部是否关闭窗口
onOpen : null, //窗口加载完毕时的动作
onClose : null, //窗口关闭前的动作,返回false可组织窗口关闭
onOk : null, //点击确定按钮
onCancel : null,//点击取消按钮
showBtn : true,
customPos : '' //自定义位置
};
最后,附上下载地址:http://files.cnblogs.com/lvdabao/jquery.popbox-1.1.1.zip
jQuery弹出层插件popbox的更多相关文章
- 效果非常好的 Jquery弹出层插件 jQuery Sweet alert
介绍款交互性非常不错的jquery弹出层插件,支持消息提示.错误提示.确认框提示等. 交互式体验感非常不错,比如咱们现在体验非常不错的微信支付.支付宝等完成后的效果. 不过本插件至少支持IE9+ Jq ...
- webui-popover 一个轻量级的jquery弹出层插件
该提示框插件可以和Bootstrap完美结合,但是并不一定需要和Bootstrap一起使用.它支持IE7以上的浏览器. 首先要引入需要的css js 文件 <link rel="s ...
- 分享一个JQuery弹出层插件
JQuery插件TipsWindown 1.1 一个基于jQuery的弹出层.支持拖拽,支持内容为文字,图片,URL等!至于兼容性.在IE6下,弹出对像无法绝对固定.其他应该没啥大问题: 最新更新:( ...
- layer —— 一个简单的jQuery弹出层插件
layer的使用 4.24更新:注意:layer现在有旧版1.8.5版本和新版本3.0版本的,对应引入的JQ也要不同,相对应的JQ引入1.1和3.1,否则JQ会出问题 4.21更新: 解答4-19的问 ...
- layer官方演示与讲解(jQuery弹出层插件)
1. 使用layer遇到困难?Fly社区虔诚为您解惑 2. layer 2.0 发布,以独立形式呈现的最后一个版本 3. Fork layer on Github,爱她,就给她加个星啵 当前版本:2. ...
- jQuery弹出层插件大全
1.thickbox 目前用的比较多的,最新版本是thickbox3.1 下载地址:http://jquery.com/demo/thickbox/#examples 2.colorBox 官方网站: ...
- layer (jQuery弹出层插件)使用
$(".delete").click(function(){ var work_name = $(this).data('name'); var item_id = $(this) ...
- layer(jQuery弹出层插件)
弹窗alert:默认确定按钮+右上角关闭 top.layer.alert("请选择要删除的记录!",{shade: 0.3,offset:'250px'}); 弹窗alert:默认 ...
- 网站开发常用jQuery插件总结(二)弹出层插件Lightbox_me
网站开发过程中,为了增加网站交互效果,我们有时需要在当前页面弹出诸如登陆.注册.设置等窗口.而这些窗口就是层,弹出的窗口就是弹出层.jQuery中弹出层插件很多,但有些在html5+css3浏览器下, ...
随机推荐
- iOS Xcode添加ios10.0的路径
/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneOS.platform/DeviceSupport
- linux 查看php-fpm 进程数
netstat -napo |grep "php-fpm" | wc -l
- base64格式的图片如何上传到oss
---恢复内容开始--- 对于base64图片的上传这个东西,一直是一个问题尤其是上传到oss.我们这次开发由于需要修剪图片,使用了h5的很多新特性. h5修剪图片,使用了我们的canvas.这个步骤 ...
- JSP内置对象有哪些呢?
内置对象 request request 对象是 javax.servlet.httpServletRequest类型的对象. 该对象代表了客户端的请求信息,主要用于接受通过HTTP协议传送到服务器的 ...
- [C#.net]PostMessage与SendMessage的区别
用 PostMessage.SendNotifyMessage.SendMessageCallback 等异步函数发送系统消息时,参数里不可以使用指针,因为发送者并不等待消息的处理就返回,接受者还没处 ...
- Java 第22章 mySQy
下列都是关系型数据库(在数据库中存在行.列) oracle: Oracle公司的产品(被sun公司收购) 中大型项目使用.银行系统.政府办公系统 9i/10g/11g sql server: 微软公司 ...
- js压缩
1:用cmd命名 1.1:cmd下执行命令:"copy dialog.js+menu.js abc.js/b",则会合并dialog合menu两个js到新生成的abc.js; 1. ...
- 编译器工具 Flex Bison for Windows 简单入门例子
最近从事一个系统仿真软件的开发,里面定义了自己的描述性语言MSL, MSL语言经FlexBison转换成C语言,然后用C编译器来编译并计算仿真. 现在领域驱动开发比较热门,有机会定义自己的语言对程序员 ...
- AngularJS是什么
先标明来源: https://code.angularjs.org/1.3.15/docs/guide/introduction 也就是官网针对1.3.15版的说明 What Is Angular? ...
- (转)深度分析Linux下双网卡绑定七种模式
现在一般的企业都会 使用双网卡接入,这样既能添加网络带宽,同时又能做相应的冗余,可以说是好处多多.而一般企业都会使用linux操作系统下自带的网卡绑定模式,当然现在 网卡产商也会出一些针对window ...