网站图片懒加载

网站建设小技巧 2019-11-26 14:29:42 评论

HTML代码格式

<noscript><img src="/05eastday/mobile/20191125/20191125105128_3d797111b8afa8d478e9c00cd61f8ba1_2.jpeg" class="scrollLoading" data-url="/05eastday/mobile/20191125/20191125105128_3d797111b8afa8d478e9c00cd61f8ba1_2.jpeg">

JS代码

//图片懒加载
(function(a){a.fn.scrollLoading=function(b){var c={attr:"data-url",container:a(window),callback:a.noop};var d=a.extend({},c,b||{});d.cache=[];a(this).each(function(){var h=this.nodeName.toLowerCase(),g=a(this).attr(d.attr);var i={obj:a(this),tag:h,url:g};d.cache.push(i)});var f=function(g){if(a.isFunction(d.callback)){d.callback.call(g.get(0))}};var e=function(){var g=d.container.height();if(d.container.get(0)===window){contop=a(window).scrollTop()}else{contop=d.container.offset().top}a.each(d.cache,function(m,n){var p=n.obj,j=n.tag,k=n.url,l,h;if(p){l=p.offset().top-contop,h=l+p.height();if((l>=0&&l<g)||(h>0&&h<=g)){if(k){if(j==="img"){f(p.attr("src",k))}else{p.load(k,{},function(){f(p)})}}else{f(p)}n.obj=null}}})};e();d.container.bind("scroll",e)}})(jQuery);
$(".scrollLoading").scrollLoading(); 
上一篇:自定义搜索格式 伪静态修改专用JS
下一篇:没有了

本文来自:淮安SEO

链接网址:https://www.huaianseo.cn/jiqiao/98.html

评论

说点什么吧
  • 全部评论(0
    还没有评论,快来抢沙发吧!