最近專案使用到了“懶載入”，現在更新一般，因為平時主要使移動端的開發所以庫檔案使用的是zepto.js 。當然也可以和jQuery 通用。

程式碼如下：

/**
 * Created by zhiqiang on 2015/10/14.
 * [email protected]
 * 圖片的懶載入
 **/
function loadImgLazy(node) {
    var lazyNode = $('[node-type=imglazy]', node),
        mobileHeight, lazyOffSetHeight, tempHeight, currentNodeTop, imgObject,
        imgDataSrc, localUrl;

    localUrl = location.href;
    // 獲取當前瀏覽器可視區域的高度
 

    mobileHeight = $(window).height();

    return function(co) {

        var conf = {
            'loadfirst': true,
            'loadimg': true
        };

        for (var item in conf) {
            if (item in co) {
                conf[item] = co[item];
            }
        }

        var that = {};
        var
 
 _this = {};
        /**
         * [replaceImgSrc 動態替換節點中的src]
         * @param  {[type]} tempObject [description]
         * @return {[type]}            [description]
         */
        _this.replaceImgSrc = function(tempObject) {
            var srcValue;

            $.each(tempObject, function(i, item)
 
 {
                imgObject = $(item).find('img[data-lazysrc]');
                imgObject.each(function(i) {
                    imgDataSrc = $(this).attr('data-lazysrc');
                    srcValue = $(this).attr('src');
                    if (srcValue == '#') {
                        if (imgDataSrc) {
                            $(this).attr('src', imgDataSrc);
                            $(this).removeAttr('data-lazysrc');
                        }
                    }
                });
            });
        };

        /**
         * 首屏判斷螢幕上是否出現imglazy節點，有的話就載入圖片
         * @param  {[type]} i) {                   currentNodeTop [description]
         * @return {[type]}    [description]
         */
        _this.loadFirstScreen = function() {
            if (conf.loadfirst) {
                lazyNode.each(function(i) {
                    currentNodeTop = $(this).offset().top;
                    if (currentNodeTop < mobileHeight + 800) {
                        _this.replaceImgSrc($(this));
                    }
                });
            }
        };

        //當載入過首屏以後按照佇列載入圖片
        _this.loadImg = function() {
            if (conf.loadimg) {
                $(window).on('scroll', function() {
                    var imgLazyList = $('[node-type=imglazy]', node);
                    for (var i = 0; i < 5; i++) {
                        _this.replaceImgSrc(imgLazyList.eq(i));
                    }
                });
            }
        };

        that = {
            replaceImgSrc: _this.replaceImgSrc(),
            mobileHeight: mobileHeight,
            objIsEmpty: function(obj) {
                for (var item in obj) {
                    return false;
                }
                return true;
            },
            destory: function() {
                if (_this) {
                    $.each(_this, function(i, item) {
                        if (item && item.destory) {
                            item.destory();
                        }
                    });
                    _this = null;
                }
                $(window).off('scroll');
            }
        };
        return that;
    };
}