Bootstrap 3崩溃-页面加载时隐藏内容的闪烁

Question

我正在使用Bootstrap 3构建管理仪表板，并且需要“查看更多”按钮来取消折叠某些内容。使用以下代码可以很好地解决此问题，但是在页面加载时，我们会在动画发生时立即看到折叠内容。

可以在这里找到小提琴：http : //jsfiddle.net/sSNG4/

然后使用以下代码初始化崩溃：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $(".collapse").collapse();
}); 
</script>

有谁知道如何消除未隐藏内容的闪烁？

注意：这个问题是关于Bootstrap 2的，而且该问题从来没有通过正确的解决方案得到完全解决。

Answer 1

http://getbootstrap.com/javascript/#collapse-usage

1. 在您的HTML中，更改class="collapse in"为class="collapse"。该in类别指示它的“开放”。
2. 完全删除JavaScript。该data-属性将告诉Bootstrap自动初始化可折叠div。

http://jsfiddle.net/mblase75/YyKhH/