我的 CSS 是:
.fade-in-repeat {
-webkit-animation: fadein 2s; /* Safari and Chrome */
-moz-animation: fadein 2s; /* Firefox */
-ms-animation: fadein 2s; /* Internet Explorer */
-o-animation: fadein 2s; /* Opera */
animation: fadein 2s;
}
@keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
/* Firefox */
@-moz-keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
/* Safari and Chrome */
@-webkit-keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
/* Internet Explorer */
@-ms-keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
/* Opera */
@-o-keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
我的 HTML 是:
<tr class="fade-in-repeat" ng-repeat="transaction in transactions | orderBy:transaction.time">
<td>
<div class="row">
<div class="col-lg-6">
所以随着元素的添加,我希望它们淡入。问题是有一个 FUOC在动画开始之前,这让它看起来像是在闪烁
最佳答案
只需将 opacity:0
添加到 .fade-in-repeat
的 CSS
关于css - 用于 ng-repeat 的 AngularJS CSS3 动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21320861/