js lazyload 延迟加载

lazyload={ img:document.getElementsByTagName('img') ,lazyname:'lazy_src' ,arr:'' ,getTop:function(obj){ var offset=obj.offsetTop; if(obj.offsetParent!=null){offset +=this.getTop(obj.offsetParent);} return offset; } ,init:function(){ var that=this this.pro(); window.onscroll=function(){ that.pro() } } ,pro:function(){ var scrtop=(document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop)+(document.documentElement.clientHeight||window.innerHeight||document.body.clientHeight),i=0; for(;i<this.img.length;i++){ if(this.getTop(this.img[i])<scrtop&&this.img[i].getAttribute(this.lazyname)){ this.img[i].src=this.img[i].getAttribute(this.lazyname); this.img[i].style.opacity=0; this.img[i].removeAttribute(this.lazyname); this.img[i].onload=function(){ var that=this,n=0.1; var time=setInterval(function(){ n=n+0.1; if(n>=1){clearInterval(time);} that.style.opacity=n; },50); } } } } } lazyload.init();

转载于:https://juejin.im/post/5c497644f265da616a47fbca