Preloader

by Lucas Mattos

HTML

<div id="preloader"><h1>CARREGANDO</h1></div>
    
<div id="conteudo">
    <img src="http://3rdbillion.net/wp-content/uploads/2013/11/d6c7c50b9b49412a2ad9f847dcbaeeba13.jpg">
</div>

CSS

body {
    background: #000;
}
#preloader {
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    top: 0px;
    background: #ccc;
}

JavaScript

$(document).ready(function(){
    
    //Esconde preloader
    $(window).load(function(){
        $('#preloader').fadeOut(1500);//1500 é a duração do efeito (1.5 seg)
    });
    
});