JSFiddle - React, Tailwind, and code Playground

by Anand Chowdhary

HTML

<div id="loader">Loading...</div>
<img alt="" src="http://www.letsgodigital.org/images/producten/2086/testrapport/nikon-p90-picture.jpg">

CSS

body {
    overflow: hidden;
    margin: 0;
}
#loader {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 9000;
    
    background: rgba(0, 0, 0, 0.5);
    text-align: center;
    padding-top: 40%;
    color: #fff;
    font-size: 200%;
}
img {
    height: 100%;
    width: 100%;
}

JavaScript

window.addEventListener("load", function () {
    document.getElementById("loader").style.display = "none";
});