/** 延时加载 */
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>