Display a loading bar before the entire page is loaded

Question

I would like to display a loading bar before the entire page is loaded. For now, I\'m just using a small delay:

$(document).ready(function(){
    $(\'#page\')         


        

Answer 1

HTML

I would like to display a loading bar before the entire page is loaded. 

JAVASCRIPT

$(function() {
    $(".preload").fadeOut(2000, function() {
        $(".content").fadeIn(1000);        
    });
});​

CSS

.content {display:none;}
.preload { 
    width:100px;
    height: 100px;
    position: fixed;
    top: 50%;
    left: 50%;
}
​

DEMO