JQuery Lazy Load Plugin - Make Your Blogger Page Load Faster

Lazy loader is a jQuery plugin written in JavaScript. It delays loading of images in (long) web pages. Images outside of viewport (visible part of web page) wont be loaded before user scrolls to them. Using lazy load on long web pages containing many large images makes the page load faster. Browser will be in ready state after loading visible images. In some cases it can also help to reduce server load. 

This post will explain to you how you can add JQuery Lazy Load Code in your blogger blog or any other website. It can reduce the page loading time of your site. You can see more details about this JQuery Lazy Load Plugin from here: Lazy Load Project

Here the Steps to Add Lazy Load jQuery Plugin in Blogger :

Step 1. Log in to your blogger Dashboard --> Design - -> Edit HTML.

Step 2. Scroll down to where you see </head> tag.

Step 3. Copy below code and paste it just before the </head> tag.

<script charset='utf-8' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script src='http://pwam.googlecode.com/files/jquery.lazyload.js' type='text/javascript'/>
<script charset='utf-8' type='text/javascript'>
$(function() {
$(&quot;img&quot;).lazyload({placeholder : &quot;http://pwam.googlecode.com/files/grey.gif&quot;,threshold : 200});
});
</script>

Step 4. Save your template, and you're done!