Css 在Ionic框架中收集重复项的动画

我想在ionic Framework应用程序中添加动画，如向右淡入幻灯片或从底部滑动到我的离子列表项。 所以请给我一个提示来实现这个

我使用了下面的代码，但它使用

{{list.ETitle}
{{list.LTitle}

{{name.main}
{{name.desc}}
{{name.time}

zoomInDown

动画来自库和

---

这是一个有效的例子。单击

卡片列表

按钮开始查看和列表动画。

您尝试过什么吗？？任何代码、css、库？？我尝试过，但它不起作用。我想在屏幕上添加动画滚动，在codepen中我使用了反弹动画。这是因为

集合重复的
属性
显示
。看看这个演示。它可用于收集重复功能谢谢您的工作很好，但请告诉我为什么收集重复功能不能用于离子项目
收集重复功能
设置
显示：绝对！重要信息
。当与
animate.css
一起使用时，这会使所有列表元素彼此重叠。因此，您只能看到一个列表项正在设置动画。如果我想在滚动上添加动画，我将怎么做？
         <ion-content>
          <ion-list>
              <ion-item class="item-avatar animated zoomInDown list-card" collection-repeat="list in listitem" href="#/app/listitems/{{listitem.id}}">
                  <img src="{{list.Icon}}">
                  <h2>{{list.ETitle}}</h2>
                  <p>{{list.LTitle}}</p>
              </ion-item>
            </ion-list>
          </ion-content>

<ion-content>
  <div collection-repeat="name in names">
    <ion-item class="animated zoomInDown list-card">
      <div class="main">{{name.main}}</div>
      <div class="desc">{{name.desc}}</div>
      <div class="time">{{name.time}}</div>
      <div class="img-holder"><img ng-src="{{name.img}}"></div>
    </ion-item>
  </div>
</ion-content>