Tiny Performant Image Lazy Load Plugin with jQuery - imgLazyLoad
| File Size: | 4.92 KB |
|---|---|
| Views Total: | 3454 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
A simple, lightweight and high performance jQuery image lazy load plugin that delays loading of images until they enter viewport.
How to use it:
1. Make sure to load the imglazyload.js plugin after you've loaded jQuery library.
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script> <script src="imglazyload.js"></script>
2. Insert your images into the webpage using data-src attribute. The original src
<img data-src="1.jpg" src="loading.svg"> <img data-src="2.jpg" src="loading.svg"> <img data-src="3.jpg" src="loading.svg"> ...
3. Call the function on the img tag and we're done.
$('img').imgLazyLoad();
4. Plugin's default options.
$('img').imgLazyLoad({
// jquery selector or JS object
container: win,
// jQuery animations: show, slideDown, etc
effect: 'fadeIn',
// aniamtion speed
speed: 600,
// animation delay
delay: 400,
// callback function
callback: function(){}
});
This awesome jQuery plugin is developed by Barrior. For more Advanced Usages, please check the demo page or visit the official website.











