如果动画angularjs崩溃

Question

我在angularjs中使用动画有一个小问题。我可以展开和折叠div，但当我折叠它时，div的内容在容器折叠后消失。他们应该一起崩溃。我在这里做了一个jsfiddle:

http://jsfiddle.net/7tb4g/119/

CSS非常简单:

.animate-if.ng-enter, .animate-if.ng-leave {
    -webkit-transition: 1s linear all;
    -moz-transition: 1s linear all;
    -ms-transition: 1s linear all;
    -o-transition: 1s linear all;
    transition: 1s linear all;
}
 .animate-if.ng-enter {
    max-height: 0;
    opacity: 0;
}
 .animate-if.ng-enter.ng-enter-active {
    max-height: 999px;
    opacity:1;
}
 .animate-if.ng-leave {
    max-height: 999px;
    opacity:1;
}
 .animate-if.ng-leave.ng-leave-active {
    max-height: 0;
    opacity:1;
}

谢谢

Answer 1

修改overflow:hidden;

.animate-if.ng-enter, .animate-if.ng-leave {
    -webkit-transition: 1s linear all;
    -moz-transition: 1s linear all;
    -ms-transition: 1s linear all;
    -o-transition: 1s linear all;
    transition: 1s linear all;
    /* no overflow during animation */
    overflow:hidden;
}

演示