大图片延时加载

来源：互联网发布：手机店分红软件编辑：程序博客网时间：2024/04/28 13:26

/** 延时加载 */var ImgLazy = function() {            var $winH = $(window).height(); //获取窗口高度            var $img = $("img[lazy='y']");  //获取页面上要延时加载的图片集合            var $imgH = parseInt($img.height() / 2); //图片到一半的时候显示            var $srcDef = "../../images/sprite.gif";            var runing=function() {                $img.each(function(i) {//遍历img                                  var $src = $(this).attr("original"); //获取当前img URL地址                    var $scroTop = $(this).offset(); //获取图片位置                    if ($scroTop.top + $imgH >= $(window).scrollTop() && $(window).scrollTop() + $winH >= $scroTop.top + $imgH) {//判断窗口至上往下的位置                        if ($(this).attr("src") == $srcDef) {                            $(this).hide();                        }                        $(this).attr("src", function() { return $src }).fadeIn(300); //元素属性交换                    }                })            }            runing(); //页面刚载入时判断要显示的图片            $(window).scroll(function() {                runing(); //滚动刷新            })        };        $(function() {            ImgLazy();        });

<img src="<app:path/>/images/sprite.gif" original="fileview?imagePathURL=${imageDto.imgEncodePath}" lazy="y" name="img_name" title="${imageDto.fileOrgName}" alt="${imageDto.remark}" /></a>

0 0