High-performance jQuery Image Lazy Load Plugin - imageLoader

File Size: 5.33 KB
Views Total: 1286
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
High-performance jQuery Image Lazy Load Plugin - imageLoader

imageLoader is a jQuery based image lazy loading plugin that uses jQuery cache mechanism to smartly and efficiently lazy load images with support for horizontal or vertical page scrolling.

More Example:

How to use it:

1. Load jQuery library and the jQuery imageLoader plugin at the bottom of the document so the page loads faster.

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="imgLoader.js"></script>

2. Place your images into data-src attribute instead of src.

<img data-src="image.jpg" src="placehoder.jpg" alt="Alt">

3. Call the plugin on the img tag and done.

$('img').imgLoader()

4. Plugin options available.

$('img').imgLoader({

  // data attribute to hold the images
  dataSrc : 'data-src', 

  // parent container
  container : window,

  // vertical or horizontal scrolling
  vertical : true, 

  // distance in px to trigger the lazy load
  threshold : 0 

})

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