JSFiddle - React, Tailwind, and code Playground

by mmansion

HTML

<div id="veil">
</div>

<div id="page">
    <h1>Loaded Content</h1>
</div>

CSS

body {
    margin: 0;
}
#page {
    position: absolute;
    width: 100%;
    height: 100%;
    background: yellow;
}
#veil {
   position: absolute;
   background-color: white;
   background-image: url(http://www.sevenswords.com/smith-darv2/images/photos/SmithsonianLogo2.gif);
    background-position: center center;
    background-repeat: no-repeat;
   width: 100%;
   height: 100%;
   z-index: 999;
}

JavaScript

var gifDelay = 2000;

setTimeout(function() {
    $('#veil').animate({opacity: 0}, 250);
},gifDelay);