JSFiddle - React, Tailwind, and code Playground

by Ali Khaled

HTML

<div class="fade_container">
    <div id="namefade"><img src="http://patrickcohen.net/wp-content/uploads/2013/09/raspberry.jpg"></div>
</div>
<div class="main">Some other content here that is revealed as the image fades away. Cool huh?</div>

CSS

.main {
    width:300px;
    padding:50px;
}
.fade_container {
    height:1px;
    text-align:center;
    position:absolute;
    left:0;
    top:0;
	z-index:9999;
}

.fade_container img {
	position:relative;
	width:100%;
}

JavaScript

jQuery.noConflict()
jQuery(document).ready(function(){
    (function($){
    $('#namefade').fadeOut(5000);
        })(jQuery);
});