See the DEMO

Animate your freshly loaded images or replace them if the image is not found !

while loading	When image not found

angular-img-onload add classes, describing the state of the image.

bower install https://github.com/marg51/angular-img-onload.git#0.0.2

add bower_components/angular-img-onload/dist/angular-img-onload.js to your files

Load the module via AngularJS

var MyApp = angular.module('MyApp', ['uto.img-onload']);

Each <img> with the attribute ng-src will be affected.

	app.config(function(imgOnloadProvider) {
    	imgOnloadProvider.setImage("http://path/to/new/image");
	});

examples of css

img {
	display: inline;
}
div.img-onload img,
div.img-onload-error img {
	display: none;
}

img {
	transition: all 0.3s ease-in;
	-webkit-transition: all 0.3s ease-in;
	opacity: 1;
}
div.img-onload img,
div.img-onload-error img {
	opacity: 0;
}

npm install
bower install
grunt

and go to /public/index.html

MIT