JS图片懒加载
View Code
lazyload: function(){//懒加载deal图片 if (!$('.dynload')[0]) { return; } var imgs = $('.dynload'); var langImgs = imgs.length; var arrayImgs = new Array(); var signLang = 0; var beginStart = false; for (var i = 0; i < langImgs; i++) { arrayImgs[i] = imgs.eq(i); } function dynLoadImg(){ if (beginStart) return; beginStart = true; setTimeout(function(){ for (var j = signLang; j < langImgs; j++) { if (typeof(arrayImgs[j].attr('imgsrc')) != 'undefined' && arrayImgs[j].offset().top < $(document).scrollTop() + $(window).height() + 800) { arrayImgs[j].attr('src', arrayImgs[j].attr('imgsrc')).removeAttr('imgsrc'); signLang++; } } beginStart = false; }, 100); } $(window).scroll(function(){ dynLoadImg(); }) dynLoadImg(); }
标记为class="dynload"的img元素被懒加载出来
html页面源代码如下方式
<img class="dynload" src="http://xxx.com/img/a.gif" imgsrc="http://xxx.com/img/filename.jpg">