Simple Pageload (Font Awesome)

HTML

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css">
<body>
    <div id="loader">
        <div>
		    <div><i class="fa fa-spinner fa-spin"></i></div>
        </div>
	</div>
    <a href="javascript:void(0)" onclick="$("#loader").delay(1000).fadeOut("fast");">Reload</a>
    <a href="#" onclick="$("#loader").fadeOut("fast");">Loading</a>
    <a href="#" onclick="$('#myForm').bind('submit', function() {
  $('#loader').show();
});">Show</a>
</body>

CSS

/* Pageload
-------------------------------------------------- */

#loader {
	position: fixed;
	z-index: 100;
	width: 100%;
	height: 100%;
	background: #fff;
	color: #000;
}

#loader div {
	position: absolute;
	left: 50%;
	top: 45%;
	line-height: 0;
}
#loader div i {
	position: relative;
	left: -50%;
	line-height: 0;
	font-size: 50px;
}

JavaScript

$(window).load(function() {
    $("#loader").delay(1000).fadeOut("fast");
});