Thursday 7 July 2011

Ringankan Blog Dengan Lazy Loader

Lazy Loader adalah plugin jQuery di mana efek lazy load akan menangguhkan proses loading bagi image yang terdapat pada blog. Efek Lazy load hanya akan berfungsi apabila page di scroll. Image selepas page yang di scroll akan terpapar dengan menggunakan efek jQuery Lazy Load. Untuk melihat Demo, sila klik disini.

Lazy Load membantu meringankan blog dengan mengurangkan tempoh masa proses loading page pada sesebuah blog terutama pada blog yang banyak memaparkan image gambar ataupun image yang bersaiz besar.

Untuk memasang jQuery Lazy Load di blogspot, ikut beberapa langkah di bawah.

Langkah 1

Login Blogger Dashboard --> Design --> Add A Gadget --> HTML/Javascript.

Copy dan paste kod di bawah pada content HTML/Javascript.



<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript' src='https://sites.google.com/site/jquery01/jquery.lazyload.mini.js?ver=1.5.0'></script>
<script type="text/javascript">
jQuery(document).ready(function($){
if (navigator.platform == "iPad") return;
jQuery("img").lazyload({
effect:"fadeIn",
placeholder: "http://3.bp.blogspot.com/_LZtXSNcp76A/THkEtEOZfrI/AAAAAAAABRo/IARVMD_8TwA/s1600/grey.gif"
});
});
</script>

  klik Save.


Catatan :

1. Jika tidak ada perubahan efek yang terjadi setelah kode di Save, coba pastekan kode tersebut sebelum atau di atas kode </body> pada script template.

2. Jika belum juga terjadi perubahan setelah kode tersebut di paste di atas atau sebelum kode</body>, coba dengan paste kode tersebut sebelum atau di atas kode </head>

0 comments:

Post a Comment

Silahkan Komentarnya Gan ^_^
Jangan SPAM Ya