网页预加载loading特效

什么是预加载？

怎么做预加载loading特效

CSS代码

.animationload {

position: fixed;

top: 0;

left: 0;

right: 0;

bottom: 0;

background-color: #fff; /* change if the mask should have another color then white */

z-index: 999999; /* makes sure it stays on top */

}

.loader {

width: 200px;

text-indent: -99999;

height: 200px;

font-size: 0;

position: absolute;

left: 50%; /* centers the loading animation horizontally one the screen */

top: 50%; /* centers the loading animation vertically one the screen */

background-image: url(../images/loading.gif); /* path to your loading animation */

background-repeat: no-repeat;

background-position: center;

margin: -100px 0 0 -100px; /* is width and height divided by two */

}

 

JS代码：

// Page Preloader

$(window).load(function() {

$(".loader").delay(300).fadeOut();

$(".animationload").delay(600).fadeOut("slow");

});

 

HTML代码：

<div class="animationload">

  <div class="loader">玩命加载中...</div>

</div>