Show loading image while Page is loading using jQuery

Introduction:

Web pages takes time to load and sometimes when page is heavy (full of images) then it takes more time to load. Would it not be nice to show loading images or message while your page is loading. It creates responsive webpage and gives nice user experience. The user will come to know that something is loading.

HTML:

CSS

#dvLoading
{
   background:#000 url(images/loader.gif) no-repeat center center;
   height: 100px;
   width: 100px;
   position: fixed;
   z-index: 1000;
   left: 50%;
   top: 50%;
   margin: -25px 0 0 -25px;
}

JS: