javascript + css 原生态弹出层
2015-07-10 16:24
671 查看
javascript + css 原生态弹出层
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <style type="text/css"> #divSCA { position: absolute; width: 880px; height: 550px; font-size: 12px; background: #fff; border: 0px solid #000; left: 50% !important; top: 15% !important; margin-left: -440px; z-index: 10001; display: none; } .big-div { position: absolute; left: 0px; top: -185px; width: 100%; height: 2000px; background-color: rgb(17, 17, 17); opacity: 0.7; z-index: 1000; } </style> <script> function openDiv() { document.getElementById("divSCA").style.display = "block"; document.getElementById("BigDiv").style.display = "block"; document.body.parentNode.style.overflow = "hidden"; } function closeDiv() { document.getElementById("divSCA").style.display = "none"; document.getElementById("BigDiv").style.display = "none"; } </script> </head> <body> <button type="button" class="btn btn-primary" onclick="openDiv()"> Select Deposit </button> <div id="divSCA"> <button type="button" onclick="closeDiv()"> X </button> </div> <div id="BigDiv" class="big-div" style="display:none"></div> </body> </html>
相关文章推荐
- js变量以及其作用域详解
- ArcGIS for js API 3.10
- js判断文件上传大小,兼容FF IE CHROME
- javascript重置Radio单选按钮
- EL与JSTL
- JS 学习记录
- json格式封装,以及格式转换
- 原型prototype -- 深入理解javascript
- jsp页面使用 jstl,出现 Unknown tag (c:foreach)
- js RegExp 替换括号
- <A href="javascript:void(0)">什么意思?
- js Date扩展Format()函数
- js之轮播再改进
- JS的全局变量与局部变量
- JS字符(字母)ASCII码转换方法
- 自定义脚本运行TestComplete项目
- 高质量的javascript代码 -- 深入理解Javascript
- RequestAnimationFrame更好的实现Javascript动画
- JSP——EL表达式
- ExtJs Grid 日期控件列 显示问题