NG-像表面上看起來可能不工作

Question

我經歷以下鏈接..

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

codepen link

我用它在我的應用程序，但沒有得到變換方式和動畫效果

HTML：

<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" /> 
    </div> 
</div> 

Angular：

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

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

}]); 

CSS：

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 1

您需要將引用添加到您的項目，

https://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.min.js 
https://cdn.jsdelivr.net/angular.image-appear/1.11.3/ng-image-appear.min.js