CSS赢得't填充视图端口

CSS won't fill view port

本文关键字：填充 视图 赢得 CSS      更新时间：2023-09-26

我有一个div覆盖，当点击链接时会弹出，我的问题是你必须滚动才能点击链接，然后覆盖仍然位于页面顶部，而不是用户当前正在查看的区域。

你可以在这里向下滚动并点击任何链接，例如"多个订单"和底部的条款和条件。

这是CSS：

  .black_overlay{
        display: none;
        position: absolute;
        /*top: 0%;
        left: 0%;
        width: 100%;
        height: 1000px; */
        top: 0px;
        right: 0px;
        left: 0px;
        bottom: 0px;
        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: 25%;
        left: 25%;
        width: 50%;
        height: 50%;
        padding: 16px;
        border: 5px solid blue;
        background-color: white;
        z-index:1002;
        overflow: auto;
  }

以及JavaScript:

<a href = "javascript:void(0)" onclick =    "document.getElementById('light3').style.display='block';document.getElementById('fade').style.display='block'">here</a>

在覆盖元素（.black_overlay和.white_content）上使用position: fixed，而不是position: absolute;

相关文章：