Javascript 按下按钮时使背景处于非活动状态

当我在twitter背景上单击一个用户名时，它会变得不活跃和黑暗。就像这样：

当按下按钮时，我想使我的网站背景处于非活动状态，我如何才能做到这一点

注意：我现在想知道，当按下按钮时，我应该使用哪种解决方案使一个框在我的站点中间出现/消失？我正在这样做

//in css
.visible{
    display: inline;
}
.hidden {
    display: none;
}

//in jquery
$("#div1").click(function() {
    $('#div2').removeClass("visible").addClass("hidden");
}

这叫做灯箱。

---

第一次点击应该会让你高兴：

你正在尝试构建lightbox。只需显示全屏div和半透明的背景色

简单解决方案：

CSS:

HTML:

---

使用CSS。。。使用

：active

您看到的是一个。twitter有一个很棒的api，它使这项工作变得简单。你也可以自己使用css来做这件事。现在我得到了你的解决方案，但是为什么我们不只写“文档”。还是只有一个单词不使用宽度和高度属性来将自己扩展到页面？

.lightbox {
    display:none;
    position: absolute;
    z-index:10;
    background-color: rgba(255,255,255,0.7);
}

<a href="#">Show lightbox</a>
<div class="lightbox"></div>
</body>

$("a").on("click",function(){
$(".lightbox").css({'width':$(document).width()+'px','height':$(document).height()+'px'});
$(".lightbox").show();
return false;

});