- Images outside of viewport (visible part of web page) wont be loaded before user scrolls to them.
- Using Lazy Load on long web pages containing many large images makes the page load faster.
- Browser will be in ready state after loading visible images. In some cases it can also help to reduce server load.
How to Use?
1) Include the jquery files
2)You must alter your HTML code. Put the place holder image into src attribute. Demo pages use 1×1 pixel grey gif.
URL of the real image must be put into data-original attribute.
It is good idea to give Lazy Loaded image a specific class. This way you can easily control which images plugin is binded to.
<img src=”img/grey.gif” data-original=”img/example.jpg” width=”640″ heigh=”480″>
3) then in your code do:
threshold : 200 ,
effect : “fadeIn”,