Question

我想显示带有一些按钮的div，第一次加载我的网站，我希望该网站无法使用，直到该div关闭其中一个按钮（例如，当您在image.google.com中选择图像时之后，您会看到所选图片与从其后面提取的网站，但该网站有点暗，就像网站的照片一样）

我希望我可以问我的意思，如果句子结构错了，我真的很抱歉，因为英语是我的第二语言

Answer 1

<div id="overlay">
  <div id="dialog">
    Close me to see anything else
  </div>
</div>

#overlay{
position:fixed;
z-index:9999;
top:0;
left:0;
width:100%;
height:100%;
background-color:rgba(0,0,0,.3);
}
#dialog{
width:200px;
height:100px;
margin-left:-100px;
margin-top:-50px;
left:50%;
top:50%;
position:absolute;
background-color:#ffffff;
border:1px solid #666;
padding:20px;
}

http://jsfiddle.net/MqVMr/

这是一个更新的小提琴：http://jsfiddle.net/MqVMr/1/

全屏http://jsfiddle.net/MqVMr/1/show/

Answer 2

您需要创建一个绝对定位于高z-index的浮动div。直接在这个浮动div元素下面应该有一个元素，它与body元素的宽度和body元素clientHeight的高度相匹配，你可以将其称为屏幕。为屏幕提供黑色背景，不透明度为25％。屏幕将截取所有点击，因为它在页面的其余部分分层，除了在其上方分层的模态。

Answer 3

试试这段代码......

<html>
<head>
    <script type="text/Javascript">
        function loading()
        {
            var sss = document.getElementById('back');
            sss.style.opacity="0.20";
            return true;
        }
    </script>
    <style type="text/css">
    #set {
        width:350px;
        height:350px;
        margin: 0 auto;
        background:#ccc;
        color:#000;
    }
    </style>
</head>
<body>
<div id="back">
    <div id="set">
            <h1>This div you have to view.</h1>
        <input type="button" onclick="loading();" value="Button"/>
    </div>
</div>
</body>

你也可以使用jquery ......最好的......

如何在站点主页上显示该站点无法点击的窗口（div）

3 个答案: