<lazyload-image>

Photo by Susana Fernandez

About

Extended Image Element for lazy image loading as Web Components. Images will be loaded when they are shown.

Usage

Load lazyload-image.js in your HTML.

<script src='lazyload-image.js'></script>

Modify your <img> elements such as following.

<img is='lazyload-image' src='path/to/your/image.jpg' width='100' height='100'>

Fallback

If browser does not support document.registerElement(), Images will be loaded as usual.

Offset option

You can specify load offset.

<img is='lazyload-image' src='path/to/your/image.jpg' offset='200' width='100' height='100'>

License

MIT: http://1000ch.mit-license.org/