JSFiddle - React, Tailwind, and code Playground

HTML

<div id="banner">Banner</div>
<div id="mask"></div>
<div>Content Lorem Ipsum</div>

CSS

#mask
{
    background-color:#000;
    opacity: 0.7;
    width:100%;
    position:fixed;
    z-index:1;
}
#banner
{
    position:absolute;
    z-index:2;
    width:200px;
    height:200px;
    background-color:#fff;
    top:calc(50% - 200px/2);
    left:calc(50% - 200px/2);
    text-align:center;
}

JavaScript

$("#banner").on("click", function() {
$("#banner, #mask").hide();
});
$('#mask').height($(document).height());