现在很多网站都流行这种弹出式的对话框或是信息显示框,很想将这个流行元素加入到自己的项目中。使用jQuery可以不费大力气实现这种效果。将其记录到我的Blog中,与业界朋友们起分享。
先上个效果图,可以点击Close按钮或是在遮罩层上任意处点击,就可以关闭弹出层。
HTML代码
代码很简洁。最外层是一个大的DIV作为弹出层的容器,H4作为弹出层的标题,又一个DIV用于弹出层正文内容显示,再一个Div用于放置一些按钮。
CSS代码
JS代码
版权声明:本文为博主原创文章,未经博主允许不得转载。
相关推荐
jquery div 弹出框 jquery div 弹出框 jquery div 弹出框 jquery div 弹出框
在页面加载后或者点击页面的某个链接时弹出一个div层,同时页面的其他地方会变灰
JQuery PopupDiv 弹出层插件 v1.0 JQuery PopupDiv 弹出层插件 v1.0
jquery js div 弹出
css + div 滑动弹出div效果,可自定义弹出效果。
jquery仿div透明模态弹出窗插件下载
JQUERY弹出模式DIV 采用JQEURY_CSS
jquery弹出代码、div弹出代码
jquery弹出div加缓冲效果
JQuery DIV弹出层,使用简单,灵活,快捷!
jQuery 中的简单实用的网页中div弹出效果 超酷!
Jquery弹出div层窗口以及div屏幕居中, 背景滤镜效果, div拖拽效果 在IE和FireFox测试通过!
jquery.magnific-popup.js 弹出Div模式窗口
jQuery超炫淡入淡出效果DIV渐变居中弹出框插件
一个很好的jquery插件弹出div。最近做项目一直在用jquery,一个很不过的框架!尤其是插件能简化很多开发工作!学习交流.
带关闭按钮jquery+div消息弹出层代码例子
使用jQuery插件jQuery Image Flyout弹出图片,实现javascript弹出放大图片功能只需要一行代码即可实现。 四,用户自定义设置 结合jQuery插件Easing Plugin,可增强javascript图片放大和缩小过程中图片显示的效果。 ...
jquery弹出可拖拽的div,组件式使用,使用的时候图片需要自己替换
jquery div 可拖拽弹出对话框 .
本实例使用jquery实现对话框的功能,点击链接即能在另外一层弹出对话框形式,例如登录对话框等……