Question

我有一个班级overlay。目的是我可以将它添加到任何div以在加载数据时创建叠加层。除了内容可能溢出的divs之外，它的效果非常好。

HMTL

<div id="myDiv" >
    <div class="overlay"></div>
    <div id="innerDiv"></div>
</div>

CSS

.overlay{
  position: absolute;
  background-color: #888888;
  top: 0px;
  opacity: 0.5;
  bottom: 0px;
  right: 0px;
  left: 0px;
  z-index: 50px;
}

这是一个例子的 JSFiddle 即可。在框中向下滚动，您将看到问题。

Answer 1

如果没有任何JavaScript，您必须将height的{{1}}传递给innerDiv css。

http://jsfiddle.net/urahara/8z842871/3/

.overlay

使用jQuery，您可以动态地执行此操作：

http://jsfiddle.net/urahara/8z842871/5/

.overlay { display:block; position:absolute; background-color: #888888; top: 0px; opacity: 0.5; height:600px; overflow:hidden; bottom: 0px; right: 0px; left: 0px; z-index: 50; }

干杯！

CSS覆盖在可滚动的DIV上

1 个答案: