0

ここのアニメーションが機能しない理由がわかりません: http://plnkr.co/edit/ulq1MQNDtY9cO2pcjdzF?p=preview

起こるべきことは次のとおりです。

  • 0クラスの追加時: からに成長し200px、背景色を から に遷移さredせますblue
  • 200pxクラスの削除時: からに縮小し0、背景色を から に遷移さgreenせますyellow

理由はありますか？
ありがとうございました。

4

1 に答える 1

0

アニメーションが機能しないと言っていると思います。問題は、アニメーションを「.heading」に追加しているのに、「.expanded」のみを切り替えていることです。

CSS アニメーションはクラスを追加した場合のみ適用されるため、クラスを削除してクラスを追加するとアニメーションがアクティブになります。

次のコードは、ウルのアニメーションを修正します

<div class="container" ng-class="{expanded:isVisible}">
  <h1 ng-class="{heading:isVisible}">Hello Plunker!</h1>
</div>
于 2013-12-16T19:12:10.243 に答える