JSFiddle - React, Tailwind, and code Playground

by arthur58831

HTML

<div id="divOverlay" class="overlay">
</div>

<p>
    Conteúdo...
    <br />
    <img src="http://placekitten.com/400/250"/>
</p>

<br /><br /><br />

<a id="linkExibir" href="#">Exibir overlay...</a>

CSS

.overlay {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 1000;
    display: none;
    background-color: #dddddd;
    opacity: 0.65;
}

JavaScript

$( "#linkExibir" ).click( function(){
    $( "#divOverlay" ).show();
});

$( "#divOverlay" ).click( function(){
    $( "#divOverlay" ).hide();
});