我在 ng-switch 上有一个简单的幻灯片动画。我想在动画第一次完成时有一个不同的动画。我该怎么做。这是我使用的类:
.ngSwitchAnimation {
position: absolute;
width: 100%;
height: 100%;
}
.ngSwitchAnimation.ng-enter,
.ngSwitchAnimation.ng-leave {
-webkit-transition : 0.5s linear all;
-moz-transition : 0.5s linear all;
-ms-transition : 0.5s linear all;
-o-transition : 0.5s linear all;
transition : 0.5s linear all;
}
.ngSwitchAnimation.ng-enter {
left: -100%;
}
.ngSwitchAnimation.ng-enter-active {
left: 0;
}
.ngSwitchAnimation.ng-leave {
left: 0;
}
.ngSwitchAnimation.ng-leave-active {
left: 100%;
}
最佳答案
请看下面的示例,其中不透明度为 0 放置一个状态,其中 1 为相反。
.animate-if {
background:white;
border:1px solid black;
padding:10px;
}
.animate-if.ng-enter, .animate-if.ng-leave {
transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
}
.animate-if.ng-enter,
.animate-if.ng-leave.ng-leave-active {
opacity:0;
}
.animate-if.ng-leave,
.animate-if.ng-enter.ng-enter-active {
opacity:1;
}
关于javascript - 不同的 ng-switch 动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47073182/