div遮盖层

<html>
<head>
<title></title>
<script type="text/javascript">
function show() {
document.getElementById(
"mask").style.display = "";
document.getElementById(
"content1").style.display = "";
document.getElementById(
"mask").style.filter = "Alpha(Opacity=10)";//透明度
document.getElementById("content1").innerHTML = "你的内容<input onclick='hide()' type='button' value='确定'/>";
}
function hide() {
document.getElementById(
"mask").style.display = "none";
document.getElementById(
"content1").style.display = "none";
}
</script>
</head>
<body>
<div style=" 100%; background-color:Gray; display:none; height: 100%; position:absolute;left:0px;top:0px;" id="mask"></div>
<div style=" 260px; background-color:Blue; display:none; height: 113px; position:absolute; left: 244px; top: 137px;" id="content1"></div>
<div id="fuck">
<input onclick="show()" type="button" value="显示"/>
</div>
<script type="text/javascript">
function ScrollDiv() {
document.getElementById(
"mask").style.top = document.body.scrollTop+ "px";
document.getElementById(
"mask").style.left = (document.body.scrollLeft) + "px";
}
window.onscroll
= ScrollDiv;
window.onresize
= ScrollDiv;
//window.onload = ScrollDiv;如果是ajax中用这个会出现问题。
</script>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
</body>
</html>

原文地址:https://www.cnblogs.com/xingbinggong/p/2182755.html