html - オーバーレイでページ全体を無効にする

Question

ポップアップの背後で使用するオーバーレイを作成したいと思います。しかし、ページを下にスクロールすると、オーバーレイはもうありませんか？javascriptを使用してページのコンテンツの高さを取得し、同じ高さをオーバーレイに適用できますが、cssベースのソリューションはありますか？

#overlay{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
   top: 0px;
   background-color:#000;
   opacity: .75
}

Answer 1

positionfixedスタッキングの問題を防ぐために、dabblet.comにデモを追加する必要がありますz-index: 9999999;

#overlay{
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color:#000;
    opacity: .75;
    z-index: 9999999;
}

Answer 2

position属性をに変更するだけfixedです。