Question

因此，当第一次折叠时，引导程序崩溃只是简单的动画，就像我使用javascript将显示从无变为阻止而没有动画，但是当可折叠元素被隐藏时，没有抖动我觉得一切都很正常，但在那之后，每当你再次折叠元素时，它就会紧张不安。

和html，因为涉及抖动崩溃的大多数问题都是由html引起的（其他包括paddings，但我的元素没有填充）：

<div class="container-fluid" style="height:100%;">
<a href="#social" class="btn" id="socialToggle" data-toggle="collapse">Social Media <span id="bottomChevron" class="fa fa-chevron-circle-down" style="font-size:90%;"></span></a>

    <div class="container collapse" id="social">

    <div class="col-md-12">

    <ul id="socialList">
    <li><a href="#"><span class="fa fa-facebook-f"></span></a></li>
    <li><a href="#"><span class="fa fa-google-plus"></span></a></li>
    <li><a href="#"><span class="fa fa-github-alt"></span></a></li>
    <li><a href="#"><span class="fa fa-twitter"></span></a></li>
    </ul>

    </div>

    </div>
    </div>

看到css的小提琴。

当我删除#social上的“height：33％”时，修复了第一个错误（第一次点击动画无效），当我删除“高度：100％”时，修复了第二个错误（当变得可见时出现抖动） .col-md-12“（最后一个元素的直接孩子）。

请向我提供有关由高度引起的引导崩溃错误的任何链接。

Answer 1

正如我的第二条评论所指出的那样，它是高度的百分比。这有效：

#social {
width:100%;
xxheight:100px; 
padding:0
}

#social .col-md-12 {
width:100%;
height:300px;
padding:0;
}

Bootstrap Collapse第一次没有动画并且第一次有一个紧张的动画

1 个答案: