Monday, July 25, 2011

Ringankan Blog Dengan jQuery Lazy Load

Baca tutorial 'Timbang Berat Blog Anda' di sini sebelum membaca tutorial ini.


Tutorial ini adalah sebahagian daripada tutorial 'Timbang Berat Blog Anda'. Jadi untuk memahami kondisi berat blog anda, sila baca tutorial mengenai 'Timbang Berat Blog Anda' tersebut.


Mahu Penimbang Berat Blog Di Blog Sendiri? Klik sini.

Widget jQuery Lazy Load ini akan skip loading gambar yang ada di blog anda dan hanya akan di'loading' secara automatik semasa anda scroll blog anda ke bawah. Jadi loading time anda akan berkurang dan memudahkan pelawat untuk memasuki blog anda.

Tutorial

1. Login Dashboard > Design > Add A Gadget > HTML/Javascript.
2. Copy code di bawah ini dan paste 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>


3. Akhir sekali, klik Save.

Lihatlah hasilnya!!

No comments:

Post a Comment