Animoitu viahto infoscreeniin.
This commit is contained in:
@@ -18,4 +18,20 @@
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.swap-animation.ng-enter, .swap-animation.ng-leave {
|
||||
transition:0.5s linear all;
|
||||
}
|
||||
.swap-animation.ng-enter {
|
||||
opacity:0;
|
||||
}
|
||||
.swap-animation.ng-enter-active {
|
||||
opacity:1;
|
||||
}
|
||||
.swap-animation.ng-leave {
|
||||
opacity:1;
|
||||
}
|
||||
.swap-animation.ng-leave-active {
|
||||
opacity:0;
|
||||
}
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
var app = angular.module('infoApp', []);
|
||||
var app = angular.module('infoApp', ['ngAnimate']);
|
||||
|
||||
|
||||
|
||||
app.controller('infoscreen_main', function($scope, $http,$timeout){
|
||||
var index = -1;
|
||||
app.controller('infoscreen_main', function($scope,$timeout){
|
||||
$scope.index = -1;
|
||||
var templates = [
|
||||
{
|
||||
template: "/static/html/test1.html?img=siklogo",
|
||||
@@ -17,8 +17,8 @@ app.controller('infoscreen_main', function($scope, $http,$timeout){
|
||||
},
|
||||
];
|
||||
$scope.next = function(){
|
||||
index = (index + 1) % templates.length;
|
||||
$scope.active = templates[index];
|
||||
$scope.index = ($scope.index + 1) % templates.length;
|
||||
$scope.active = templates[$scope.index];
|
||||
$timeout($scope.next,5000);
|
||||
}
|
||||
$scope.next()
|
||||
|
||||
@@ -7,6 +7,7 @@
|
||||
<title>Infoscreen</title>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.js"></script>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-route.js"></script>
|
||||
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-animate.js"></script>
|
||||
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
|
||||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
|
||||
@@ -15,8 +16,10 @@
|
||||
<script src="/static/js/infoscreen_controllers.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div ng-controller="infoscreen_main" >
|
||||
<div id="infocontent" ng-include="active.template" onload="active.onload()"></div>
|
||||
<div class="container ng-scope" ng-controller="infoscreen_main" >
|
||||
<div ng-animate-swap="index" class="cell swap-animation">
|
||||
<div id="infocontent" ng-include="active.template" onload="active.onload()"></div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user