在打开动画后得到消息命运 [英] Getting message to fate away after animating open
本文介绍了在打开动画后得到消息命运的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有一个按钮
<!DOCTYPE html>
<html>
<head>
<style>.animate-show.ng-hide-add,
.animate-show.ng-hide-remove {
-webkit-transition:all linear 0.5s;
-moz-transition:all linear 0.5s;
-o-transition:all linear 0.5s;
transition:all linear 0.5s;
display:block!important;
}
.animate-show.ng-hide-add.ng-hide-add-active,
.animate-show.ng-hide-remove {
line-height:0;
opacity:0;
padding:0 10px;
}
.animate-show.ng-hide-add,
.animate-show.ng-hide-remove.ng-hide-remove-active {
line-height:20px;
opacity:1;
padding:10px;
border:1px solid black;
background:white;
}
.check-element {
padding:10px;
border:1px solid black;
background:white;
}
</style>
</head>
<body>
<div ng-app=App>
<button ng-click="showme=true">Submit</button>
<div class="check-element animate-show" ng-show="showme">
I show up when the Submit button is clicked.
</div>
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular-animate.min.js"></script>
<script type="text/javascript">
angular.module('App', ['ngAnimate']);
</script>
</body>
</html>
它运行良好：
img src =https://i.stack.imgur.com/QXvmr.pngalt =enter image description here>
但如何获得
推荐答案
我已经设置了一个 plunker链接，在点击提交按钮5秒后淡出DIV。下面是它的外观：
I have setup a plunker link that fades out the DIV 5 secs after submit button is clicked. Below is how it looks:
var myApp = angular.module('App', ['ngAnimate']);
myApp.controller('MyController', ['$scope', '$timeout',
function($scope, $timeout) {
$scope.showme = false;
$scope.callAtTimeOut = function() {
$scope.showme = false;
}
$scope.animateDiv = function() {
$scope.showme = true;
$timeout(function() {
$scope.callAtTimeOut();
}, 5000);
}
}
]);
这篇关于在打开动画后得到消息命运的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
