模式DIV。
来源:互联网 发布:厂牌制作软件下载 编辑:程序博客网 时间:2024/05/29 18:36
JS:
<script>
//模式DIV开始
function opendivshow(width, title, href) {
document.getElementById('lightshow').style.display = 'block';
document.getElementById('lightshow').style.width = width + "px";
document.getElementById('lightshow').style.marginLeft = -(width / 2) + "px";
document.getElementById('messagebox').style.width = width + "px";
document.getElementById('fadeshow').style.display = 'block';
$("#showdiv1").hide();
$("#showdiv2").hide();
$("#" + title).show();
}
function closedivshow() {
document.getElementById("lightshow").style.display = 'none';
document.getElementById("fadeshow").style.display = 'none';
}
//模式DIV结束
</script>
页面上:
<div id="lightshow" class="div_content">
<div id="messagebox" class="div_messageshow">
</div>
<div class="div_main">
<span id="spIndexMemberTaobaoList">请选择买号:
</span>
<br />
<div style="width: 160px; height: 30px; line-height: 30px; text-align: center; cursor: pointer;"><span style="background-color: #ccc; width: 30px; height: 30px;" onclick="SureToTakeOver();javascript:closedivshow();">确 定</span><span style="width: 30px; height: 30px; margin-left: 15px; background-color: #ccc;" onclick="javascript:closedivshow();">取 消</span></div>
</div>
</div>
<div id="fadeshow" class="div_overlay"></div>
<a id="showczm" onclick="javascript:opendivshow('300','','javascript:closedivshow()')"></a><%--showczm111111111输入操作码暂时隐藏--%>
样式
/*模式DIV开始*/
.div_overlay{
display: none;
position: fixed;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: black;
z-index:1010;
-moz-opacity: 0.8;
opacity:.80;
filter: alpha(opacity=80);
}
.div_content {
display: none;
position: fixed;
top: 30%;
left: 50%;
width: 280px;
margin-left:-140px;
height: 550px;
margin-top:-80px;
padding: 0;
border: 12px solid #3777BC;
background-color: #F0F5F8;
_position:absolute;
z-index:1011;
overflow: hidden;
}
.div_messageshow
{
height:0px;
width:280px;
line-height:0px;
text-align:center;
margin:0 auto;
color:#000;
font-size:13px;
font-weight:bold;
overflow:hidden;
margin-top:10px;
}
.div_main
{
width:160px;
margin:0 auto;
text-align:center;
line-height:25px;
height:50px;
margin-top:5px;
padding:0;
}
/*模式DIV结束*/
0 0
- 模式DIV。
- JQUERY弹出模式DIV
- DIV全屏-弹出模式对话框
- HTML5OO模式 DIV往下落
- DIV实现完美模式窗口
- DIV+CSS系列课程 (二) DIV+CSS模式介绍
- 基于jquery div模式窗口 javascript 代码
- IE8兼容模式下DIV块移动
- div盒子的几种放置模式
- div+css+javascript 实现模式化窗口
- jQuery插件封装:浮动div模式框
- div层,实现模式窗口/模态窗口/模式对话框
- DIV
- DIV
- div
- DIV
- div
- div
- JS点击复制
- Jquery各种前台效果JQ
- 异步
- jquery+ajax+ashx。ashx的使用方法
- 如何在ashx页面获取Session值
- 模式DIV。
- .net 中文传参
- 手机触屏判断
- 5分钟无操作,退出,操作方法,关闭页面
- SQL Server DATEDIFF() 函数(SQL计算时间差)
- Greenplum性能调试记录
- Sql server 事务的两种用法
- WdatePicker自定义事件(日历控件)
- 正则表达式相关