Show GIF while page loads


I need a GIF to work while the page loads. I already tried a few ways but none worked. And when the page load appears Done! . More or less as happens on this site .

asked by anonymous 08.03.2014 / 18:57

1 answer


In fact, what happens on this site is that it places content on top of a DIV that covers everything and once content is loaded ( document.load ) it hides the DIV with a fadeOut effect.

Reframe this in JSFiddle to make it easier (though you'll see the effect on your page better) .


<div id="preloader"><h1>CARREGANDO</h1></div>

<div id="conteudo">
    <img src=""></div>





Inplaceof"uploading" just put your <img> tag with a GIF you want. Although it is possible to do a simple animation with CSS3 so you do not need to use an image.

08.03.2014 / 19:42