Video Link - Go to video
Full Code -
<style>
.popup-overlay{
display: none;
position:fixed;
top:0;
left: 0;
width: 100%;
height: 100%;
background-color: gainsboro;
z-index: 999;
justify-content: center;
align-items: center;
}
.popup-box{
background: white;
padding: 20px 30px;
border-radius: 20px;
box-shadow: 2px 2px 2px 2px gray;
max-width: 300px;
}
</style>
<button onclick="showpopup()">Show Popup</button>
<!--Popup structure-->
<div class="popup-overlay" id="popup">
<div class="popup-box">
<h2>Welcome</h2>
<p>This is custom popup by phpecho</p>
<button onclick="popclose()">Close</button>
</div>
</div>
<script>
function showpopup(){
document.getElementById("popup").style.display = 'flex';
}
function popclose(){
document.getElementById("popup").style.display = 'none';
}
</script>
