echo.js改造 实现可视区域图片懒加载，lazyload效果

原来的echo.js有个缺点，快速滚动的时候不加载图片，按住滚动条不放的时候图片不加载，造成图片空白不符合项目要求

改进代码如下：

<script src="echo.min.js"></script>
<script type="text/javascript">
    window.echo = (function (window, document) {
        'use strict';
        /*
         * Constructor function
         */
        var Echo = function (elem) {
            this.elem = elem;
            this.render();
            this.listen();
        };
        /*
         * Images for echoing
         */
        var echoStore = [];
        /*
         * Element in viewport logic
         */
        var scrolledIntoView = function (element) {
            var coords = element.getBoundingClientRect();
            return ((coords.top >= 0 && coords.left >= 0 && coords.top) <= (window.innerHeight || document.documentElement.clientHeight));
        };
        /*
         * Changing src attr logic
         */
        var echoSrc = function (img, callback) {
            img.src = img.getAttribute('data-echo');
            if (callback) {
                callback();
            }
        };
        /*
         * Remove loaded item from array
         */
        var removeEcho = function (element, index) {
            if (echoStore.indexOf(element) !== -1) {
                echoStore.splice(index, 1);
            }
        };
        /*
         * Echo the images and callbacks
         */
        var echoImages = function () {
            for (var i = 0; i < echoStore.length; i++) {
                var self = echoStore[i];
                if (scrolledIntoView(self)) {
                    echoSrc(self, removeEcho(self, i));
                }
            }
        };
        /*
         * Prototypal setup
         */
        Echo.prototype = {
            init : function () {
                echoStore.push(this.elem);
            },
            render : function () {
                if (document.addEventListener) {
                    document.addEventListener('DOMContentLoaded', echoImages, false);
                } else {
                    window.onload = echoImages;
                }
            },
            listen : function () {
                window.onscroll = echoImages;
            }
        };
        /*
         * Initiate the plugin
         */
        var lazyImgs = document.querySelectorAll('img[data-echo]');
        for (var i = 0; i < lazyImgs.length; i++) {
            new Echo(lazyImgs[i]).init();
        }
    })(window, document);
    Echo.init({
        offset: 0,
        throttle: 0
    });
</script>