Simple Loader II

by Kevin Pliester

HTML

<body>
    <div id="loader">
        <div class="loader-status"><span></span>

        </div>
    </div>
    <div class="center">
<a href="javascript:location.reload();">Reload</a>

    </div>
</body>

CSS

html, body {
    margin: 0;
    padding: 0;
}
.center {
    text-align:center;
    padding: 5%;
}
.loader-status span {
    top: 0;
    z-index: 99999;
    position: fixed;
    background: #00a8f5;
    height: 2px;
    width: 0%;
    -webkit-animation: loader 5s;
    animation: loader 5s;
}
@-webkit-keyframes loader {
    from {
        width: 0%;
    }
    to {
        width: 100%;
    }
}
@keyframes loader {
    from {
        width: 0%;
    }
    to {
        width: 100%;
    }
}

JavaScript

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