Tips : Lazy Loading Images
Images are one of the important factor that affects blog load time.So, reduce your blog Images load time now.
Lazy Load adalah plugin jQuery yang hanya akan mengakses gambar yang terlihat dari halaman web saja, sehingga dapat meningkatkan waktu loading halaman blog anda. Gambar yang berada di luar daerah dari tampilan beranda akan dimuat apabila user menggulung (Scroll) layar ke bawah, widget ini benar-benar akan mengurangi 50% waktu loading halaman anda.
Taruh kode ini diatas</body> : JavaScript
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="http://stylifyyourblog1.googlecode.com/svn/trunk/lazyload.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
$(function() {
$("img").lazyload({placeholder : "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjb0ML7l-8jyEbrxd3pDG6PCtPKxEs4g_tgf2qiMefMDpDF7sgGA-Ttm9BcwmYCi0vNM0UIq508sdzJHiPjTWVjrtZcQtxxKz5LoIH2bKpA-A5SJw27p1kbk7e5-vRrSwZGGalgghZDChp8/s1600/greys.gif"});
});
</script>
Script ini hanya akan bekerja pada area postingan pada blog anda, jika anda ingin menempatkan efek lazy load ini pada bagian sidebar anda maka cobalah script yang satu ini.
Kode untuk menempatkan efek lazy load ini pada bagian sidebar :
JavaScript
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="http://stylifyyourblog1.googlecode.com/svn/trunk/lazyload.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
$(function() {
$(".post-outer img").lazyload({placeholder : "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjb0ML7l-8jyEbrxd3pDG6PCtPKxEs4g_tgf2qiMefMDpDF7sgGA-Ttm9BcwmYCi0vNM0UIq508sdzJHiPjTWVjrtZcQtxxKz5LoIH2bKpA-A5SJw27p1kbk7e5-vRrSwZGGalgghZDChp8/s1600/greys.gif"});
});
</script>
Note :
- Jika code
jquery 1.6.2diatas sudah ada di blog anda maka tidak usah disertakan lagi. - Anda bisa mengganti gambar pengganti yang sudah saya tandai diatas
http://www.stylifyyourblog.com/2011/10/integrating-lazy-load-into-blogger.html
