角度ng重复动画过渡不适用于`ie10`

时间:2015-07-27 17:20:43

标签: html css angularjs

我正在使用ng-repeat多个条件。并添加动画。这是我的css代码:

div.appGallery .show {
  cursor: pointer;
  border: 1px solid #fff;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -o-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-transform 1s linear;
  -moz-transition: -moz-transform 1s linear;
  -o-transition: -o-transform 1s linear;
  -ms-transition: -ms-transform 1s linear;
  transition: transform 1s linear;
}
div.appGallery .show.ng-enter {
  -webkit-transform: scale(0.1);
  -moz-transform: scale(0.1);
  -o-transform: scale(0.1);
  -ms-transform: scale(0.1);
  transform: scale(0.1);
  border: 1px solid #f00;
}
div.appGallery .show.ng-enter.ng-enter-active {
  -webkit-transform: scale(0.5);
  -moz-transform: scale(0.5);
  -o-transform: scale(0.5);
  -ms-transform: scale(0.5);
  transform: scale(0.5);
  border: 1px solid #00f;
}

这适用于chromefirefox。但在ie10,我没有得到任何过渡。应用过渡时间突然从0.1缩放到0.5。但动画不存在。

这是我的ng-repeat:

<div class="appGallery" ng-show="galleryShow">
    <a ng-click="galleryChanger(-1)" ng-show="galleryPrevButton" class="prev">prev</a>
    <a ng-click="galleryChanger(1)" ng-show="galleryNextButton" class="next">next</a>
    <div index="$index" app="app" ng-click="update(app)" class="show bgr" ng-class="['box'+$index]" ng-if="$index == 0 || $index == 13 || $index == 14 || $index == 15 || $index == 5 " ng-repeat="app in allAppsBatch">
        <h2>{{app.PhasePercentage}} % {{index}}</h2>
        <span>{{app.Name}}</span>
    </div>
    <div index="$index" app="app" ng-click="update(app)" class="show bbr" ng-class="['box'+$index]" ng-if="$index == 2 || $index == 3 || $index == 4 || $index == 6 || $index == 10 || $index == 11 || $index == 12" ng-repeat="app in allAppsBatch">
        <h2>{{app.PhasePercentage}} % {{index}}</h2>
        <span>{{app.Name}}</span>
    </div>
    <div index="$index" app="app" ng-click="update(app)" class="show bbl" ng-class="['box'+$index]" ng-if="$index == 1 || $index == 7 || $index == 8 || $index == 9 " ng-repeat="app in allAppsBatch">
        <h2>{{app.PhasePercentage}} % {{index}}</h2>
        <span>{{app.Name}}</span>
    </div>
</div>

0 个答案:

没有答案