Question

好的，所以这是一个我面临的奇怪问题：

我使用的是手风琴小工具（几乎是100％的原始引导代码）
当手风琴项目（菜单）展开时，它看起来好像需要一些时间才能获得原始形状。

为什么？

请在这里查看：http://83.212.101.132/betdk/home/three

尝试展开（点击标题）：左侧Categories侧边栏中的Soccer / World Kop 2013菜单项。为什么会这样？

（在主要＆＃34; Top Matches＆＃34;盒子中扩展手风琴项目时会发生同样的事情。）

任何建议都非常受欢迎！： - ）

Answer 1

您遇到此问题是因为您已在类的顶部和底部添加了填充.accordion-body：

.accordion-body {
    padding-bottom: 10px;
    padding-top: 10px;
}

动画完成后，浏览器会添加额外的填充，以便你有这个小故障。

要解决此问题，您只需删除.accordion-body的样式并添加：

.accordion-inner{margin: 10px 0;}

Answer 2

尝试在下面的代码中添加您的标题和ul li，并检查它是否适合您..

<div class="panel panel-default">
    <div class="panel-heading">
      <h4 class="panel-title">
        <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
          Collapsible Group Item #1
        </a>
      </h4>
    </div>
    <div id="collapseOne" class="panel-collapse collapse in">
      <div class="panel-body">
        Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
      </div>
    </div>
  </div>

检查http://getbootstrap.com/javascript/#collapse-examples

消除手风琴弹出的怪异故障

2 个答案: