Dead Simple jQuery Content Lazy Load Plugin - lazyscript

lazyscript is an ultra-light jQuery plugin to provide lazy load functionality just by adding a custom jQuery selector class to your Html elements.

How to use it:

1. Load the jQuery lazyscript plugin after loading jQuery Javascript library.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="jquery.lazyscript.js"></script>

2. Add a custom CSS class to the images which you want to delay the loading until they come into viewport.

<div data-src="1.jpg" class="lazy">Loading...</div>
<div data-src="2.jpg" class="lazy">Loading...</div>
<div data-src="3.jpg" class="lazy">Loading...</div>
...

3. Initialize the plugin and done.

$(document).ready(function () {
$(window).lazyScript({
selectorClass: 'lazy',
callback: jQuery.noop,
threshold: 0,
scrollInterval: 500
});
});

Change log:

2015-08-21

• new version with pause/resume and do not remove the class if the callback returns false

---

This awesome jQuery plugin is developed by oscarotero. For more Advanced Usages, please check the demo page or visit the official website.