0

ngAnimate を使用してアニメーション メニューを実行しようとしています。

home.html

<div id="left-menu" ng-hide="showMenu">
    <div class="wrapmenu">
      Menu
    </div>

</div>

<div id="content-wrapper" ng-show="showMenu" ng-animate="{show: 'fadeIn', hide:'fadeOut'}">
  <button id="menu" ng-click="showMenu = !showMenu"></button>
</div>

スタイル.css

.fadeIn-setup,.fadeOut-setup {
    -webkit-transition: 1s linear opacity;
    -moz-transition: 1s linear opacity;
    -o-transition: 1s linear opacity;
    transition: 1s linear opacity;
}
.fadeIn-setup{
    opacity:0;
}
.fadeOut-setup{
    opacity:1;
}
.fadeIn-setup.fadeIn-start {
    opacity: 1;
}
.fadeOut-setup.fadeOut-start{
    opacity:0;
}

ngShow と Hide はうまく機能します。しかし、アニメーションはトリガーされません。

Angular 1.1.5 に更新しました。angularドキュメントから、 CSSの構文が変更されていることがわかりました

新しい構文も試してみましたが、同じ結果が得られました。

どんな助けでも大歓迎です。

4

2 に答える 2

0

1.1.5 から 1.2 への変更の負荷。だから私のコードを1.2に移動しました。アニメーションははるかに合理化されています。

アニメーションのこの例に従いました。

悲しいことに、アニメーションに関する Angular のドキュメントはほとんどありません。YearOfMooには、最新の Angular のアニメーションに関する優れたドキュメントがあります。

于 2013-08-28T06:28:24.500 に答える