A very lightweight jQuery plugin to lazy load images
The default usage is pretty simple:
Include your images, replace the src
-attribute with an image-placeholder and use the data-src
-attribute for your real image.
<img src="holder.png" data-src="img.jpg">
If you need a fallback for those who have javascript disabled, just add a noscript
-tag after your image:
<noscript> <img src="img.png"> </noscript>
img[data-src] {display:none}
Now you've just to initialize "lately"
$("img").show().lately();
By default, images are only loaded and "unveiled" when user scrolls to them and they became visible on the screen.
If you want your images to load earlier than that, lets say 200px before they get visible, you just have to:
container: window
- The scrolling containergapX: 0
- The horizontal thresholdgapY: 0
- The vertical threshold