图片预加载。。。。

html:

 <div class="section banner">
            <span><img data-src="images/banner-1.jpg"></span>
            <span><img data-src="images/banner-2.jpg"></span>
            <span><img data-src="images/banner-3.jpg"></span>
            <span><img data-src="images/banner-4.jpg"></span>
            <span><img data-src="images/banner-5.jpg"></span>
            <p><a href="#"></a></p>
            <p><a href="#"></a></p>
            <div class="gobuy"><a href="#"></a></div>
            <div class="gobuy"><a href="#"></a></div>
 </div>

js:

$(function(){
    function loadImg(){
        var $elImg = $('.section').find("img"),
            len = $elImg.length,
            count = 0;
            console.log(len)
            
        for(var i = 0; i < len; i++){
            (function(i){
                var img = new Image(),
                    url = $elImg.eq(i).data('src');
                
                if(!url) {
                    return;
                }
                img.src = url;
                if(img.complete){
                    count++;
                    
                    $elImg.eq(i).attr('src', url);
                    if(count == len){  //加载完成
                        animations();
                    }
                } else {
                    img.onload = function(){  
                        count++;
                        $elImg.eq(i).attr('src', url);
                        if(count == len){ //加载完成
                            animations();
                        }
                    }
                }
            })(i);
        }
    }    
    loadImg();
});

function animations(){
    alert("图片加载完成！")
}

 

---

 

部分图片计算方式：

$(function(){
            function loadImg(){
                var $elImg = $('.js_img'),   //计算部分图片
                    len = $elImg.length,
                    count = 0;
                    
                for(var i = 0; i < len; i++){
                    (function(i){
                        var img = new Image(),
                            url = $elImg.eq(i).data('src');
                        
                        if(!url) {
                            return;
                        }
                        img.src = url;
                        if(img.complete){
                            count++;
                            
                            $elImg.eq(i).attr('src', url);
                            if(count == len){//加载完成
                                animations();
                            }
                        } else {
                            img.onload = function(){
                                count++;
                                $elImg.eq(i).attr('src', url);
                                if(count == len){//加载完成
                                    animations();
                                }
                            }
                        }
                    })(i);
                }
            }    
            loadImg();
        });