如何在 ng-animate 或 Animate.css 中调整 fadeInUp 的高度？

Question

对于你们大多数人来说，这可能是一个非常简单的问题，但我很难弄清楚。

我有一个数据 table 大到运行整个屏幕。它非常具体，因此分页是不可能的。我遇到的问题是动画。我有 table inside div with ng-view。我想要 fadeInUp 动画，这样 fadeInUp 似乎从顶部开始大约 60-100px。但是，当前的 fadeInUp 从我不想要的屏幕底部向上滑动。我怎样才能让它从所需的高度向上滑动？

<div ng-view class="content-wrapper ng-fadeInUp">

[ng-view].ng-enter{ animation:fadeInUp1秒；<br> }

这就是它从屏幕底部向上滑动的原因。我尝试使用 "Animate.css" 来做同样的事情。我想要它，这样它看起来几乎不会向上滑动。只是一点动画提示而不是完整的向上滑动。

Answer 1

从示例 animate.css 中提取 original CSS 并修改它：

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.fadeInUp {
  animation-name: fadeInUp;
}

将translate3d中的第二个参数改成你想要的，例如：

transform: translate3d(0, 20px, 0);

演示： http://plnkr.co/edit/W5zsmhYkwXxYJbuft5pu?p=preview

如何在 ng-animate 或 Animate.css 中调整 fadeInUp 的高度？

How to adjust the height for fadeInUp in ng-animate or Animate.css?

angularjs

ng-animate

animate.css