Question

我正在尝试动画ng-if使用max-height属性，但无法使其在Chrome中运行。（它适用于Firefox。）我错过了什么或者是Chrome中的错误？

.slide-down-up {
  background:green;
  border:1px solid black;
  padding:10px;
  overflow: hidden;
}

.slide-down-up.ng-enter {
    transition: max-height 0.5s ease-in;    
    max-height: 0;
}   

.slide-down-up.ng-enter.ng-enter-active,
.slide-down-up.ng-leave {
    max-height: 600px;  
}

.slide-down-up.ng-leave.ng-leave-active {
    max-height: 0;  
}

.slide-down-up.ng-leave {
    transition: max-height 0.5s ease-out; // doesn't work
    transition: max-height 1s ease-out; // works    
}

以下是plunker： https://github.com/rentpath/clj-dotenv

Answer 1

Updated Plunker

修复延迟解决方案：

将cubic-bezier（0,1,0,1）转换函数放入元素。

MainPage.xaml.cs

webkit浏览器中的max-height转换

1 个答案: