1 files changed, 80 insertions, 0 deletions
diff --git a/www/lib/ion-image-lazy-load/README.md b/www/lib/ion-image-lazy-load/README.md
new file mode 100644
index 00000000..f3d823f9
--- /dev/null
+++ b/www/lib/ion-image-lazy-load/README.md
@@ -0,0 +1,80 @@
+ionic-image-lazy-load
+=====================
+
+
+## Demo
+http://codepen.io/mvidailhet/pen/yNOGzY
+http://codepen.io/pavei/pen/oFpCy
+
+## Quick Start
+
+Install using bower
+
+```sh
+bower install ion-image-lazy-load --save
+```
+
+or
+
+
+Download the file JS *ionic-image-lazy-load.js*, save on your project and load it on your *index.html*.
+
+
+```html
+<script src="path/to/ionic-image-lazy-load.js"></script>
+```
+
+Load into your module:
+
+```javascript
+angular.module('yourapp',
+              ['ionic', 'ionicLazyLoad'])
+```
+
+Set the `lazy-scroll` directive on your `<ion-content>` tag, that will listen to the scroll event:
+
+``` javascript
+<ion-content lazy-scroll>
+```
+
+And set the `img-lazy-src` directive on the image attribute instead of `src`:
+
+```javascript
+ <img image-lazy-src="{{item.thumbnail}}">
+```
+
+You can also use it as a background-image for an element by setting the `image-lazy-background-image` paramameter to true:
+``` javascript
+<div image-lazy-src="{{item.thumbnail}}" image-lazy-background-image="true"></div>
+```
+
+You can also set an option to auto call `$ionicScrollDelegate.resize()` when the image `load` (default value is `false`):
+
+```javascript
+ <img image-lazy-src="{{item.thumbnail}}" lazy-scroll-resize="true">
+```
+
+To show a ionic spinner while the image is loading, just specify a ionic spinner type (list is here: http://ionicframework.com/docs/api/directive/ionSpinner/):
+
+```javascript
+ <img image-lazy-src="{{item.thumbnail}}" image-lazy-loader="lines">
+```
+Note: the styling of the loader position is up to you. The directive adds this html:
+
+```html
+<div class="image-loader-container">
+    <ion-spinner class="image-loader" icon="#spinnerStyle#"></ion-spinner>
+</div>
+```
+
+You can set a distance from the bottom or right side of the screen where the image will start loading.
+This will allow to start loading the image 100px below the bottom of the screen:
+
+``` javascript
+ <img image-lazy-src="{{item.thumbnail}}" image-lazy-distance-from-bottom-to-load="100">
+```
+
+This will allow to start loading the image 100px before the right side of the screen:
+```javascript
+ <img image-lazy-src="{{item.thumbnail}}" image-lazy-distance-from-right-to-load="100">
+```