jquery – When page is loading, display a image after 5 seconds swap with text – Education Career Blog

I have a div that has content in it.

<section id="latest-news">
  <p>Pellentesque habitant morbi
  tristique senectus et netus
  et malesuada fames ac turpis

But while the page is loading, I want a loading .gif to appear, wait about 5 seconds and the the text. With a fadeIn or slide down animation too. (The text would be hidden by default)

I tried for an hour on this but I can’t get it to work :/

What is a way to do this?


<div id='loading'><img src='loading.gif' /></div>
<div id='content' style='display:none'><p>content here</p></div>

<script type='text/javascript'>
  , 5000);

I’m not sure if you can put anonymous function inside setTimeout, but that’s the general idea.

Leave a Comment