图片预加载

<div class="loadingPage">
    <div class="logo_wrap">
        <img src="../../assest/images/cartoon/logo2.gif">
        <img class="logo_cover water" src="../../assest/images/cartoon/logo_cover.png">
    </div>
</div>
 var imageItem = ["da1.jpg", "da2.jpg", "da3.jpg", "da4.jpg", "da5.jpg", "da6.jpg", "da7.jpg", "1.jpg","left.png","logo.png","logo_cover.png","look_plus_bg.png","more.png","narrow.png","p1_bg.jpg","p3_bg.jpg","p2_bg.jpg","p2_img1.png","p2_img2.png","p3_img1.png","p3_img2.png","p5_img.png","plus.png","pop1.png","right.png","s1.png","s2.png","s3.png","share.png","title.png","turn.png","video.png","vol.png"];

    function loadImage(op, path) {
        var _path = path || 'images/';
        var len = 0;
        for (var i = 0; i < op.length; i++) {
            var img = new Image();
            img.src = _path + op[i];
            img.onload = function () {
                len++;
                var topNum = len / op.length * 100;
                if (topNum < 100) {
                    $(".logo_cover").css('top', -topNum -30+ "%");
                }else{
                    $(".loadingPage").hide();
                    $(".page1").addClass('animateIt');
                }
            };
        }
    }
    loadImage(imageItem);

http://m.haibao.com/features/StarisComing_33/效果就是这个

 _option.processCallback = function (c, t) {
        $('.loadText').html(Math.round(c / t * 100) + '%');
    };
这个是百分比的算法

 

posted @ 2016-09-08 14:27  雪明瑶  阅读(259)  评论(0编辑  收藏  举报