JSFiddle - React, Tailwind, and code Playground
by Andrew Lyndem
HTML
<div>
<img class="main" id="main" src="https://www.heartthis.com/img/category_home.jpg" />
<img id="overlay" class="overlay" src="http://brightdoctors.vn/wp-content/uploads/2014/07/tick-1.png"
/>
</div>
CSS
div {
position:relative;
}
#main {
width:250px;
height:250px;
}
#overlay {
position:absolute;
height: 150px;
width: 150px;
top: 50px;
left: 50px;
}
.overlay{display:none;}
.overlay-show{display:block;}
JavaScript
$('img.main').on('click', function(e) {
$('.overlay').toggleClass("overlay-show");
});
$('.overlay').on('click', function(e) {
$('.overlay').toggleClass("overlay-show");
});