Membuat Loading Blog Lebih Cepat
14:32:00
By Unknown
tip tip blogger
0
komentar
Hai sobat blogger, pada tutorial kali ini kita akan membahas bagaimana membuat loading blog lebih cepat hanya dengan meminimalisir load pada gambar yang ada. Ini juga akan memberikan efek pada gambar yang dinamis jika Anda scroll kebawah. Jadi ini akan sangat baik jika Anda membuat beberapa script dibawah ini, script? Yah sobat script, tetapi tenang saja ini mala memang membuat load gambar akan semakin cepat.
Cara Membuat_Nya ==> Buka akun blogger Anda
Masuk ke menu edit HTML,
centang expand template ,
Cari kode dibawah ini :
Pastekan kode Javascript dibawah ini, diatas pada kode </head>
Semoga Berhasil Happy Blogger
Cara Membuat_Nya ==> Buka akun blogger Anda
Masuk ke menu edit HTML,
centang expand template ,
Cari kode dibawah ini :
Pastekan kode Javascript dibawah ini, diatas pada kode </head>
<script type='text/javascript'>//<![CDATA[
(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(){if(a.abovethetop(this,c)||a.leftofbegin(this,c)){}else if(!a.belowthefold(this,c)&&!a.rightoffold(this,c)){a(this).trigger("appear")}else{if(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"))}if("scroll"!=c.event||undefined==a(b).attr("src")||c.placeholder==a(b).attr("src")||a.abovethetop(b,c)||a.leftofbegin(b,c)||a.belowthefold(b,c)||a.rightoffold(b,c)){if(c.placeholder){a(b).attr("src",c.placeholder)}else{a(b).removeAttr("src")}b.loaded=false}else{b.loaded=true}a(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===undefined||c.container===window){var d=a(window).height()+a(window).scrollTop()}else{var d=a(c.container).offset().top+a(c.container).height()}return d<=a(b).offset().top-c.threshold};a.rightoffold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).width()+a(window).scrollLeft()}else{var d=a(c.container).offset().left+a(c.container).width()}return d<=a(b).offset().left-c.threshold};a.abovethetop=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollTop()}else{var d=a(c.container).offset().top}return d>=a(b).offset().top+c.threshold+a(b).height()};a.leftofbegin=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollLeft()}else{var d=a(c.container).offset().left}return 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/AVvXsEj-l2BVPQyRLLcjhwjo2H9MTH3IawmrS283UtyADbt333nPZxwgbBtdM1GIHH0iFj80SZVHbPByAyM3FLNbMAYw50BRFD_UsTu3U-Nhpkgv_as_ifiKDyP9z0PUr73ZaFtw7pQnUMaVZuo/s1600/truebloggertricks.blogspot.com.gif",effect:"fadeIn",threshold:"-50"})})//]]></script>
Simpan Template Anda... !!!
Semoga Berhasil Happy Blogger
0 komentar: