Back to Top

How to use jQuery Lazy Load Plugin?

Lazy Load Plugin for jQuery Explained

Hello readers,

Today I am going to explain about lazy loading plug-in in jQuery which loads the page first and then page request go to load the images of the page.

And you can see here, Lazy load plug-in is simply great which decrease the loading time of the page and increase a performance of the site.

With the use of Lazy load plug-in in jQuery, you can load a long web pages containing many of the large images and load page faster and a browser will be in ready state after loading all visible images.In some cases, Lazy load plug-in can also help to reduce server load.

so, Let’s understand steps by step, How do you integrate the Lazy Load?

Step 1:

First of all, Include following js files into the head of your HTML.


// latest version of jQuery core file

Step 2:

Next, You need to set loader image into src of Img tag and set actual image path into a data-original attribute.see in below example,



Step 3:

Now, Write javascript code which will trigger event based on class added into an image.


$("img.lazy-load").lazyload({ 
    event : "click"
});

OR you can write javascript code like following and call image based on class.


$(".lazy-load").lazyload();

Also READ:

To Call Remote URL in $.ajax method in jQuery
To read JSON data with jQuery
Solution: Internet connection issue on AndroidEmulator

That’s it, You can also use it. It’s useful to load a page faster and decrease a load of the server.

Hope this helps someone else out.As always, thanks for reading. Don’t Forget to Follow us on Twitter or Subscribe us to Get the Latest Updates.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Most Popular Posts

How To Reset resourceID in MODx

Posted on 6 years ago

Bhumi

How to use Ajax in WordPress

Posted on 5 years ago

Bhumi

JQuery Animation effects

Posted on 6 years ago

Bhumi

The Reader’s Poll – June 2015

Posted on 3 years ago

Bhumi

The Reader’s Poll – August 2014

Posted on 4 years ago

Bhumi

The Reader’s Poll – June 2014

Posted on 4 years ago

Bhumi

The Readers’ Poll – May 2014

Posted on 4 years ago

Bhumi

The Readers’ Poll – August 2013

Posted on 5 years ago

Bhumi