闲来无事做了一个前台UI的dialog组件,测试了一下运行良好,能支持IE6、7、8和firefox2.0,其他没测。调用也非常简单配置好相应参数就可以了。
软件功能:
* 无限级弹出窗口
* Esc退出block弹出窗口
* 可拖动窗口
* 模态窗口
* 模态alert警告对话框
* 模态confirm对话框
* 页面局部模态
* 绑定按钮响应函数
* 弹出窗口加载iframe
* 自定义背景样式
组件提供了六个函数:
$.funkyUI // 弹出模态窗口
$.unfunkyUI // 关闭模态窗口
$.alert //警告提示对话框
$.confirm //确认和取消对话框
$.fn.block //块模态
$.fn.unblock//解除块模态
调用示例:
$.blockUI({
url:"1.html",//弹出窗口显示的内容,使用iframe
OKEvent:okEvent,//okEvent是自定义的确定按钮响应函数,
css:{width:"700",height:"500"}
});
$.alert("这是警告窗口");
$.confirm("这是个Boolean窗口");
$('#blocked').block();//id为blocked的元素设置为只读
$('#blocked').unblock();//解除
实现的思路:
我在主窗体中创建一个层,用来作为弹出窗体,包含一个iframe,通过参数指定URL,作为显示的内容,我觉得可能会有利于代码的重用,代码管理起来要方便一些
弹出窗口中含有的弹出窗口也在主窗体中创建,这样结构简单一点,比较容易管理。我在创建弹出窗口的时候在主窗体中声明一个栈,把当前iframe的window对象压入栈,这样不管我现在弹出了多少个窗口总能很容易的找到其中的任意一个的对象。
有感兴趣的把我的代码下载回去看看,然后给我提提意见,帮我提高。。。
觉得可用的随便用,有不明白的问我
新上传了修正版,修正了弹出框弹出位置不太精确的bug,新增无弹出窗体提示信息,用于类似Ajax请求等待。
再次上传修正版本2,此版本修正了二楼提出的bug,另外修复了进行局部block 后,弹出对话框不能正常unblock的bug
2009-7-8上传对ie6下不能遮挡select选框的修正版本(发现一个意想不到的bug,赶紧删掉)
分享到:
- 2009-06-17 11:00
- 浏览 13927
- 评论(92)
- 论坛回复 / 浏览 (87 / 89683)
- 查看更多
相关推荐
Jquery实现模态窗口效果;
模态子窗口alert confirm 弹窗
jquery 模态modal弹出式登录框窗口.zip
JQuery实现可移动模态窗口 JQuery实现可移动模态窗口 JQuery实现可移动模态窗口
jquery 模态窗口
很好用的模态弹出窗口,可自定义弹出窗口外观源码! 值得下载看看!资源免费,大家分享!! 更多免费资源 http://ynsky.download.csdn.net/
Jquery的插件,漂亮的Jquery弹出模态窗口提示框,使用纯Jquery实现
Jquery实现模态框,包含对表的修改,删除,详情查看,增加等功能,代码简介,通俗易懂,对该代码原主人表示感谢!
一套jQuery模态消息对话框插件SweetAlert2,用于替代浏览器默认的弹出对话框,它提供各种参数和方法,支持嵌入图片,背景,HTML标签等,并提供5种内置的情景类,功能非常强大。
jquery仿div透明模态弹出窗插件下载
Jquery实现的弹出层效果,跟百度的注册页面的效果一样。。。。。。
jquery 弹出模态窗体
× <h4 class="modal-title" id="myModalLabel">Modal header 1 ... 一款在Bootstrap模态窗口和Popover的基础上,使用velocity.js来制作模态窗口和Popover打开时的动画过渡效果的jQuery打开模态窗口代码。
jQuery Dialog弹出层对话框插件演示,简单的那种,看上去比较不错,下面说一下用法: 基本操作 默认的 new Dialog(‘这是一个默认对话框‘).show(); 非模态对话框 new Dialog(‘非模态对话框,可以打开多个.,{modal...
自己制作的DIV模态窗口,点击弹出DIV窗口,后层页面屏蔽,实现模态窗口。需要用vs2010打开
CSS3和jQuery实现模态窗口样式的用户注册UI界面特效源码.zip
jquery.edbox.js是一款轻量级的jquery响应式模态窗口插件。通过该jquery模态窗口插件,你可以轻松的制作出响应式的,带动画效果的,可基于AJAX的模态对话框效果。
代码简介:jQuery模态窗口登陆效果是一款基于jquery实现的网站登录框弹出特效代码。
漂亮的jQuery模态消息对话框插件SweetAlert2.zip