javascript - 以滚动条显示页面居中的 DIV 内容

Question

我需要显示一个 div:

<div class="detailcontainer" id="detailcontainer"></div>

类:

.detailcontainer
{
    position:absolute;
    visibility:hidden;
    width:1000px;
    height:auto;
    top:50%;
    left:50%;
    margin-left:-500px;
    margin-top:-150px;
    border-radius:3px;
    background:rgba(35,31,32,.7);
    z-index:60;
}

在带有滚动条的页面中间。

实际上，div出现在页面的顶部(这里可见http://www.izigo.pt/Ad/GetAllByCategory?categoryId=1，点击列表底部的一辆车，它会出现在顶部)

如何打开可见区域中间的汽车细节？

谢谢

Answer 1

尝试

position:fixed;

代替

position:absolute

即使滚动，它也会保持可见。

.detailcontainer
{
    position:fixed;
    visibility:hidden;
    width:1000px;
    height:auto;
    top:50%;
    left:50%;
    margin-left:-500px;
    margin-top:-150px;
    border-radius:3px;
    background:rgba(35,31,32,.7);
    z-index:60;
}

DEMO (向下滚动并按下点击我)