Preloader Script for Your Blogger Blog

Preloader Script will load all your page content before showing it. 

Nah, the  page won't show until all page elements are not fully loaded. Anyway, here's the demo to explain it:

Demo

Let's now implement it!

First, as usual from Dashboard > Template > Edit HTML then find </head> paste the code below just above it:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js' type='text/javascript'/>
<script src='http://mattmorzcodes.googlecode.com/files/queryLoader.js' type='text/javascript'/>

Second, find </body> then paste the code below just above it,

<script type='text/javascript'>
    QueryLoader.init();
</script>

and lastly, find ]]></b:skin>  paste the code below just above it.

.QOverlay {
background-color: #000000;
z-index: 9999;
}
.QLoader {
background-color: #CCCCCC;
height: 1px;
}

Then Save you template.

The script is created by this amazing site and I just want to share on how to implement it in Blogger blog. That's all folks!