覆盖某个div的层
0
悬赏园豆：10
[已解决问题]
解决于 2015-09-17 09:24
怎么设置一个层的属性，可以让这个层完全覆盖页面上的都一块内容。内容的宽度和高度是变量。
最佳答案
1
<script type="text/javascript">
window.onload = function() {
triggerdivcover();
}
window.onresize = function () {
triggerdivcover();
}
function triggerdivcover() {
var top = $("#divcontent").offset().top;
var left = $("#divcontent").offset().left;
var width = $("#divcontent").width();
var height = $("#divcontent").height();
$("#divcover").width(width);
$("#divcover").height(height);
$("#divcover").css({ "left": left, "top": top });
}
</script>
<div id="divcontent"></div>
<div id="divcover" style="z-index:5;background-color:gray;filter:alpha(opacity=50); /*ie滤镜，透明度50%*/
-moz-opacity:0.5; /*Firefox私有，透明度50%*/
opacity:0.5;/*其他，透明度50%*/
position:absolute;
"></div>
然后根据你的实际情况当div内容变动时 触发triggerdivcover() 方法 应该就可以了
收获园豆：10
谢谢你，回答的太完善了。
其他回答(1)
0
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>覆盖层</title> <style> body { margin: 0; padding: 0; font-family: 'Microsoft yahei'; font-size: 12px; } #conver { position: absolute; display: none; opacity: .4; background: #fff; left: 0; top: 0; } </style> <script> window.onload = function() { var html = []; html.push("<ul>"); for (var i = 0; i < 40; i++) { html.push("<li>index " + i + "</li>"); } html.push("</ul>"); document.getElementById("container").innerHTML = html.join(""); var converObj = document.getElementById("conver"); converObj.style.width = "100%"; converObj.style.height = "500px"; converObj.style.display = "block"; } </script> </head> <body> <div id="conver"></div> <div id="container"></div> </body> </html>
非常感谢你的回答，但我的意思是内容是个变量，但不论怎么变这个层都是一直完全覆盖这一块的，而不是写个变量然后在上面加一个层。。。
@乐乐酱: 没明白你说