Angular-UI Bootstrap折叠没有动画

Question

是否可以停用Collapse的动画？

我对动画的问题是，总有一个是活动的，其余的都是崩溃的， 所以我不希望每个元素都移动（即使它是几秒钟）。 或者如果可能的话只是一个“淡出”动画。但不是“从下面流行”。

Answer 1

使用版本0.12.1，覆盖collapsing类的动画持续时间，并为我设置一个小值：

HTML 的

<div class="your-class" collapse="collapsed">
    <!-- ... -->
</div>

CSS

.your-class.collapsing {
    transition-duration: 0.0125s;
}

将持续时间值设置为0不起作用，因为它导致元素无限期地保持collapsing状态。

---

<强>更新

虽然上述解决方案运行良好，但我最终只使用ng-show / ng-hide完全摆脱了不受欢迎的动画。

Answer 2

Collapse指令使用Transition指令来执行动画。似乎没有指定转换类型的选项。尽管如此，折叠指令看起来非常简单，所以你应该能够将它作为启动程序用于编写带有所需动画的新指令。或者您可以提交增强请求以添加该功能。

Answer 3

您可以为元素和/或其父级指定新类，然后将新转换设置为父级子元素/元素新课程：

transition: all 0 ease 0; 

这是W3C的默认值。 如果这样做无助于尝试将规则设置为！important;