Question

我有这个CSS：

#platinumHeader.ng-hide-remove  {
-webkit-animation: fadeInDown 0.5s!important;
-moz-animation: fadeInDown 0.5s!important;
-o-animation: fadeInDown 0.5s!important;
animation: fadeInDown 0.5s!important;
}

这个HMTL：

<header class="navbar-fixed-top header-floating" data-ng-show="isHeader" id="platinumHeader">
        <div class="container">

          ...
        </div>
    </header>

但是当显示我的标题时（即isHeader设置为true），它只显示没有动画。

但是如果我这样写CSS（没有#platinumHeader选择器）：

.ng-hide-remove  {
-webkit-animation: fadeInDown 0.5s!important;
-moz-animation: fadeInDown 0.5s!important;
-o-animation: fadeInDown 0.5s!important;
animation: fadeInDown 0.5s!important;
}

工作正常。我做错了什么？

Answer 1

尝试使用ngClass指令

<header class="navbar-fixed-top header-floating" ng-class="{'ng-hide-remove' : isHeader}" data-ng-show="isHeader" id="platinumHeader">
        <div class="container">

        </div>
</header>

Angular .ng-hide-remove动画不起作用

1 个答案: