jquery弹出层背景变暗 Lee dialog
作者:十字花匠 来源:十字花匠 时间:2008-08-18 13:11:00
经常会看到这种弹出层背景变暗的效果,感觉手痒于是自己写了一个基于jquery的弹出层类。
我习惯先写好结构和样式,然后再写js交互效果。结构定义了两个层,一个为半透明的背景层,一个是弹出层主要结构,都设为浮动position:absolute;背景层遮掉所有body内容很容易做到。主要层左右居中,设置left等于窗口宽除二减去自身层宽除二就居中了,至于窗口上下居中我没做到,固定了top等于滚动条隐去的scrollTop加上50px;
当事件触发这个类时,首先判断一下两个层是否已经append到body里面,否则每次触发它就一直增加增加了。设置了五个参数title、content、width、height、cssName,它们分别定义了层标题、层内内容、层宽、层高、层内容的样式名。层内内容又设置了url、text、id、iframe四种加载方式,通过ajax以get或post加载目标url的html内容,text是直接在事件里写入内容,而id是取得页面上某个id里面的html显示到弹出层里,iframe都知道是在层里面以框架显示目标url了。往往弹出层里面的内容样式也是各种各样的,所以加了一个参数cssName,通过它就可以把层内的内容给排好了。
看看演示:
相关下载:
下载最新版本jQuery
下载Lee dialog插件:
下载地址:dialog.js (2.17 KB)
更新
2008-8-16 层切换时加入动画
2008-8-15 完成基本功能
标签:jquery,弹出,层
![](/images/zang.png)
![](/images/jiucuo.png)
猜你喜欢
Google谷歌的CSS前景图片合并技术
2009-07-13 12:21:00
![](https://img.aspxhome.com/file/UploadPic/20097/13/82009621221830-30s.png)
ASP自动清除ACCESS数据库的日文字符
2007-11-28 17:40:00
ASP压缩ACCESS数据库实例
2009-01-19 11:47:00
Bad Tags — html有害的标签
2008-10-13 19:47:00
小议sqlserver数据库主键选取策略
2011-10-24 19:51:30
asp如何将统计的访问者数目周期性地保存?
2009-11-26 20:54:00
如何以及何时使用sIFR
2008-03-07 12:38:00
SQL SERVER 与ACCESS、EXCEL的数据转换方法分享
2012-02-25 20:17:22
sqlserver中去除字符串中连续的分隔符的sql语句
2012-06-06 20:07:39
ASP实现上传图片自动压缩图片大小
2010-01-25 12:47:00
用文本+ASP打造新闻发布系统
2009-02-02 09:31:00
ASP技巧 挂QQ的网页源代码ASP/PHP
2009-01-05 12:36:00
经验:解决DB2中出现的SQL1032N错误现象
2009-09-02 14:10:00
CSS网页布局开发时的常见问题小结
2009-08-13 12:17:00
HTML5 声明兼容IE的写法
2011-06-06 10:34:00
MySQL数据库单一表突破4G限制的实现方法
2008-11-02 14:43:00
ASP 生成静态新闻列表
2009-03-03 12:25:00
SQL Server数据转换服务基本概念介绍
2009-01-20 15:52:00
Oracle 插入超4000字节的CLOB字段的处理方法
2009-07-12 18:52:00
分布式DBA:SQL存储过程知识总结
2009-02-24 17:17:00