禁用Bootstrap的Collapse打开/closuresanimation

任何技巧来禁用打开/closuresanimation的折叠组？

Answer 1

对于Bootstrap 3和4来说

.collapsing { -webkit-transition: none; transition: none; display: none; } 

Answer 2

boostrap 2的 CSS解决scheme： .collapse { transition: height 0.01s; } .collapse { transition: height 0.01s; }

NB ：设置transition: none禁用折叠function。

Answer 3

如果您在展开之前find1px的跳转，并且在使用CSS解决scheme进行折叠之后发现有点烦人，那么下面是Bootstrap 3的一个简单的JavaScript解决scheme。

只要在你的代码中添加这个地方：

 $(document).ready( $('.collapse').on('show.bs.collapse hide.bs.collapse', function(e) { e.preventDefault(); }); $('[data-toggle="collapse"]').on('click', function(e) { e.preventDefault(); $($(this).data('target')).toggleClass('in'); }); ); 

Answer 4

也许不是这个问题的直接答案，但最近除了官方文档之外，还描述了如何使用jQuery 完全禁用转换：

 $.support.transition = false 

---

如接受的答案中所提到的那样，将.collapsing CSS转换为none ，将删除animation。 但是，在Firefox和Chromium中，这会导致导航栏崩溃时产生不需要的视觉问题。

例如，访问Bootstrap 导航栏示例，并从接受的答案中添加CSS：

 .collapsing { -webkit-transition: none; transition: none; } 

我目前看到的是当导航栏崩溃时，导航栏的底部边框瞬间变成了两个像素，而不是一个，然后令人不安地跳回到一个。 使用jQuery，这个工件不会出现。