Add JQuery Lazy Load Plugin to blogger


This post will explain to you how to add JQuery Lazy Load Plugin to your blogger blog or any other website easily.If you have a blog or website containing many images, this tricks will be very helpful to you.It can reduce the page loading time of your site.You can see more details about this JQuery Lazy Load Plugin from here:http://www.appelsiini.net/projects/lazyload.



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.


To add JQuery Lazy Load Plugin to your blogger blog or any other website follow the steps given below:

1.Login to your blogger dashboard--> layout- -> Edit HTML

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

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://bnote.googlecode.com/files/jquery.lazyload.js' type='text/javascript'/>

<script charset='utf-8' type='text/javascript'>

$(function() {

   $(&quot;img&quot;).lazyload({placeholder : &quot;http://bnote.googlecode.com/files/grey.gif&quot;,threshold : 200});

});

</script>


Note : You can download javascript files from here if you want to host above files yourself.

4.Now save your template and you are done.Refresh your site to see the result.

1 commentaires:

Unknown on June 14, 2011 at 10:20 AM said... [Reply]

cool! thanks for the blog tips! Keep it up!
http://www.iwalkthroughlife.blogspot.com

Post a Comment

 

Sponsors

Protected by Copyscape Web Copyright Protection

All For Blogs. Copyright 2011 All Rights Reserved powered by Revolution Church Theme hosted on Blogger