Lazy Load merupakan sebuah script kode yang berhubungan bersama proses loading gambar dalam situs blog.
Fungsi dari script lazy load sendiri adalah menghentikan proses loading gambar secara sementara, dan akan dilanjutkan bila halaman blog telah di scroll.
Dengan begitu loading laman blog akan lebih cepat, karena tak membutuhkan proses load gambar.
Untuk memakai script ini juga tak terlalu sulit, kamu hanya perlu memasukkan script kode lazy load sebelum kode penutup </body>.
Untuk lebih jelasnya tentang cara memasang script lazy load, silahkan ikuti saja caranya dibawah ini:
1. Pertama-tama buka situs blogger.com
2. Pilih Tema>Edit HTML
3. Salin kode dibawah ini, sebelum kode </body>
<script type='text/javascript'>//<![CDATA[// Lazy Load(function(a)a.fn.lazyload=function(b)var c=threshold:0,failurelimit:0,event:"scroll",effect:"show",container:window;if(b)a.extend(c,b)var d=this;if("scroll"==c.event)a(c.container).bind("scroll",function(b)var e=0;d.each(function()else if(!A.belowthefold(this,c)&&!A.rightoffold(this,c))a(this).trigger("appear")elseif(e++>c.failurelimit)return false);var f=a.grep(d,function(a)return!A.loaded);d=a(f))this.each(function()var b=this;if(undefined==a(b).attr("original"))a(b).attr("original",a(b).attr("src"))a.rightoffold(b,c))if(c.placeholder)a(b).attr("src",c.placeholder)elsea(b).removeAttr("src")b.loaded=falseelseb.loaded=truea(b).one("appear",function()if(!This.loaded)a("<img />").bind("load",function()a(b).hide().attr("src",a(b).attr("original"))[c.effect](c.effectspeed);b.loaded=true).attr("src",a(b).attr("original")));if("scroll"!=c.event)a(b).bind(c.event,function(c)if(!B.loaded)a(b).trigger("appear")));a(c.container).trigger(c.event);return this;a.belowthefold=function(b,c)if(c.container===undefinedvar d=a(window).height()+a(window).scrollTop()elsevar d=a(c.container).offset().top+a(c.container).height()return d<=a(b).offset().top-c.threshold;a.rightoffold=function(b,c)c.container===window)var d=a(window).width()+a(window).scrollLeft()elsevar d=a(c.container).offset().left+a(c.container).width()return d<=a(b).offset().left-c.threshold;a.abovethetop=function(b,c)c.container===window)var d=a(window).scrollTop()elsevar d=a(c.container).offset().topreturn d>=a(b).offset().top+c.threshold+a(b).height();a.leftofbegin=function(b,c)c.container===window)var d=a(window).scrollLeft()elsevar d=a(c.container).offset().leftreturn d>=a(b).offset().left+c.threshold+a(b).width();a.extend(a.expr[":"],"below-the-fold":"$.belowthefold(a, threshold : 0, container: window)","above-the-fold":"!$.belowthefold(a, threshold : 0, container: window)","right-of-fold":"$.rightoffold(a, threshold : 0, container: window)","left-of-fold":"!$.rightoffold(a, threshold : 0, container: window)"))(jQuery);$(function()$("img").lazyload(placeholder:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgri5buZj5UDVrHjFF9ZFDahYdkbeOKkVQKzfIgxqj8PRCu7g7N3w5mAEh5q9YbcvmakTPNS-paAItFKiaA9XePW1lcUwzBAJjJQkt-pLIupSghEiy2PrCJoR6eVAGmAc0tqoaVeLPJaNFr/s640/arlinadesign.gif",effect:"fadeIn",threshold:"-50"));//]]></script>
4. Terakhir Simpan Tema, dan cek blog kamu buat mengetahui hasilnya
Itu beliau cara gampang memasang lazy load pada blog. Script ini memang bisa meringankan loading blog, namun yg perlu kamu ketahui merupakan bahwa script ini tak cocok dalam semua template blog.
0 komentar:
Post a Comment