日期:2014-05-17  浏览次数:20635 次

求实现百度知道页面点登陆后出现背景灰色阴影后还能看到被覆盖的页面
要求在css和js下解决不知有没可能??
HTML code

<!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=gb2312" />
<title>无标题文档</title>
<style>
body{
    margin: 0px;
    padding: 0px;
}
#box{
    margin-top: 500px;
    margin-left: 200px;
}
#top{
    margin-top: 100px;
    margin-left: 300px;
}
#bottom{
    margin-top: 1240px;
    margin-left: 300px;
}
#sig{
    height: 20px;
    width: 90px;
    margin-left: 100px;
    margin-top: 100px;
    background-color: #0066FF;
    font-weight: bold;
    color: #FFFFFF;
}
#ajax{
    background-color: #CCCCCC;
    position: absolute;
    z-index: 9999;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
}
</style>
</head>

<body>
<div onclick="ec()" id="sig">点击注册</div>
<div id="top">
求这能看到(要求灰色背景在的前提下)
</div>
<div id="box">
求这能看到(要求灰色背景在的前提下)
</div>
<div id="bottom">
求这也能看到
</div>
</body>
<script>
function $(x){ return document.getElementById(x);}
function ec() {
if($('ajax')){
$('ajax').parentNode.removeChild($('ajax'));
}
  var div = document.createElement("div")
  div.setAttribute("id", "ajax");
  div.style.height =document.body.clientHeight+"px"; //定位
  div.style.width =document.body.clientWidth+"px";
  document.body.appendChild(div);
  $('ajax').innerHTML="<b>aaaaaaaaaaaaaaaa </b>"
  }
</script>
</html>



------解决方案--------------------
div.style.height =document.body.clientHeight+"px"; //定位
div.style.width =document.body.clientWidth+"px";

div.style.filter = "alpha(opacity=50)"; //IE
div.style.opacity = ".50"; //chromeium

document.body.appendChild(div);
$('ajax').innerHTML="<b>aaaaaaaaaaaaaaaa </b>"