Html css背景属性

当你点击facebook上的图片时，一个盒子会向上移动，但其余的整个背景会被黑色的透明层覆盖。这有什么影响？可以使用css应用它吗

<a href="#">Open FancyBox</a>
<div class="fancybox">
<div class="content">
    <div class="close">x</div>
</div>
</div>​

CSS:

​

---

您可以使用此插件：

---

//www.no-margin-for-errors.com/projects/prettypto jquery lightbox clone/

它当然可以使用css应用：

以下是黑色覆盖的css：

.overlay{
    background-color: black;
    z-index:1001;
    -moz-opacity: 0.8;
    opacity:.80;
    filter: alpha(opacity=80);
}

z索引表示覆盖位于所有其他元素之上，应该位于覆盖顶部的元素（Facebook上的图像框）必须具有值1002或更大的z索引

moz不透明度是firefox覆盖的不透明度，chrome、safari等覆盖的不透明度，。。。该过滤器用于IE的覆盖

我创建了一个有类似问题的项目，我创建了一个带有类覆盖的div，该类覆盖最初是隐藏的，当单击按钮时，可见性设置为可见。我已经在div覆盖的顶部放置了一个iFrame（z索引1002）

这是我的覆盖的css：

.black_overlay{
    display: none;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: black;
    z-index:1001;
    -moz-opacity: 0.8;
    opacity:.80;
    filter: alpha(opacity=80);
}

.white_content {
    display: none;
    position: absolute;
    top: 15%;
    left: 15%;
    width: 70%;
    height: 70%;
    padding: 0px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: 6px solid #E1143C;
    background-color: rgba(228,208,150,1);
    z-index:1002;
    overflow: auto;
}   

以及以下jQuery：

function showForm() {
    $(".black_overlay").show(200);
    $(".white_content").show(500);
}

---

对。这种效果只能用css实现

如果有任何id或类应用于该元素。那就这样做吧-

#transparentLayer {
   opacity:0.5; //for non-IE
   color:#000;
   filter: alpha(opacity=50); // for IE
}

---

？请做搜索作为灯箱，你会得到大量的工作实例，它很容易实现。这个例子和链接怎么样

function showForm() {
    $(".black_overlay").show(200);
    $(".white_content").show(500);
}

#transparentLayer {
   opacity:0.5; //for non-IE
   color:#000;
   filter: alpha(opacity=50); // for IE
}