Awesome

justlazy.js

Lightweight javascript plugin to lazy load responsive images. Most of the existing javascript plugins using extensive dependencies or supporting just the img-tag without responsive parts. This plugin is supposed to be an alternative.

>> View demo and usage

>> View history and migration path

100% performance with plain javascript (no jQuery)
100% valid HTML (no empty src tag)
Simplicity and lightness (just lazy loading of images, no special cases)
Heavily tested on various devices, browsers and OS versions

Installation

file include

You can download the latest release and include the justlazy.js file as follows in your page:

<script src="javascript/justlazy.js" type="text/javascript"></script>

If you want to use the lazy spinner, following css file is needed:

<link href="stylesheets/justlazy.css" type="text/css" rel="stylesheet">

NPM

$ npm install justlazy

Usage

Import the CSS file:

@import "justlazy/src/justlazy.css";

Import/require the JavaScript file:

var justLazy = require('justlazy/src/justlazy.js');

import justLazy from 'justlazy/src/justlazy.js';

Contributing

Just feel free to contribute ..

Project setup

To set up the project you need the grunt-cli:

$ sudo npm install -g grunt-cli

Then you just have to clone the repository and run the install command:

$ npm install

Testing

To run tests manually you can use the $ grunt command to perform jshint and jasmine tests with phantomjs. Furthermore you can run $ grunt server to call the jasmine runner in your browser localhost:9999

Continuous Integration

justlazy has CI set up through Travis CI and Sauce Labs (free for open-source projects). Pull-request and checkins will be tested automatically.