S Kalra S Kalra - 1 year ago 74
Javascript Question

ng-image-appear- not working

I go through a link below..

AngularJS Module to make images appear with transition as they load.

codepen link

I use it in my application but not getting tranisition and animation effects


<div ng-app="myApp">
<div ng-controller="myCtrl">
<img class="img1" src="https://newevolutiondesigns.com/images/freebies/tropical-beach-background-8.jpg" ng-image-appear responsive transition-duration="1s" animation="fadeInUp" animation-duration="1s" easing="ease-out" />


var myApp = angular.module('myApp', ['ngImageAppear']);

myApp.controller('myCtrl', ['$scope', function($scope) {



body {
background-color: #aaa;

.img1 {
width: 60%;
height: auto;

.img2 {
width: 70px;
height: auto;

.img3 {
width: 450px;
height: auto;

.loader-class {
background-color: rgba(255, 255, 255, .65);

.placeholder-class {
background-size: contain;

Answer Source

You need to add the references to your project,

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download