﻿/*
只有卷到的位置才加载图片，不卷到不加载
dym-img 属性为需要动态加载的原始图片
参数 
fade是否使用渐变特效
replace 没设置dym-img属性时替换的图片
plugin
*/
(function ($) {

    $.fn.DynamicImgLoad = function (params) {
        var default_params = { fade: true, replace: 'images/d.gif' };
        if (params) { $.extend(default_params, params); }
        var allPic = this;
        var tmp = $.grep(allPic, function (val) {
            return !(val.loadComplete || val.loading); //移出已加载的项
        });
        allPic = tmp;
        $(window).bind("scroll", function () {
            $(allPic).each(function () {
                if ($(this).offset().top - (document.documentElement.scrollTop + document.body.scrollTop) <= (document.documentElement.clientHeight > 0 ? document.documentElement.clientHeight : document.body.clientHeight)) {
                    $(this).trigger("show_img");
                }
            });
        });

        this.each(function () {
            var img = $(this);
            img.loadComplete = false;
            img.loading = false;
            if (img[0].nodeName != "IMG") return;
            var loadUrl = $(img).attr("dym-img");
            if (loadUrl == undefined) { loadUrl = $(this).attr("src"); $(this).attr("src", default_params.replace); }
            img.one("show_img", function () {
                if (img.loadComplete || img.loading) return false;
                img.loading = true;
                $("<img />")
                    .bind("load", function () {
                        $(img).attr("src", loadUrl);
                        if (default_params.fade) {
                            $(img).css("display", "none");
                            $(img).fadeIn("fast");
                        }
                        img.loadComplete = true;
                        img.loading = false;
                    })
                    .attr("src", loadUrl);
            });
            $(window).trigger("scroll");
            return this;
        });
    }

})(jQuery);
