<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>弹出层背景灰色不可编辑</title>
<script type="text/javascript">
//弹出层背景灰色
function locking(objDiv){
document.getElementById('ly').style.display="block";
document.getElementById(objDiv).style.display='block';
scroll(0,0);
}
//隐藏层
function hiddenDiv(objVar)
{
document.getElementById(objVar).style.display="none";
document.getElementById('ly').style.display='none';
}
</script>
</head>
<body>
<input type="button" onclick="locking('apDiv2')" value="弹出"/>
<!--弹出内容层 -->
<div id="apDiv2" style="display:none;position: fixed; z-index: 3;height:auto; padding:20px;width:auto;top:20%;left:25%;border:2px solid #a2d2d2;background-color:#fff; " >
<input type="button" onclick="hiddenDiv('apDiv2')" value="关闭"/>
</div>
<!--灰色背景层-->
<div id="ly" style="position:fixed; top:0; left:0; z-index:2; width:100%; height:100%; background:#f5f5f5; filter:alpha(opacity=70); opacity:0.7;display: none;">
</div>
</body>
</html>
