Bootstrap手风琴允许多个打开

埃米尔·莫

我已经从Bootstraps自己的源代码中获取了此手风琴代码。但是当我打开一个新的文件夹时,它不会使其他文件夹崩溃。这个问题可能已经在这里回答了,但是我找不到它。谢谢你的帮助。

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title></title>
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
    <link rel="stylesheet" href="css/style.css">
  </head>
  <body>

    <div class="container-fluid">
      <div class="navbar">
      </div>
      <div class="sidebar">

        <div class="accordion" id="accordion2">
          <div class="accordion-group">
            <div class="accordion-heading">
              <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">
                Collapsible Group Item #1
              </a>
            </div>
            <div id="collapseOne" class="accordion-body in collapse" style="height: auto;">
              <div class="accordion-inner">
                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>
          <div class="accordion-group">
            <div class="accordion-heading">
              <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
                Collapsible Group Item #2
              </a>
            </div>
            <div id="collapseTwo" class="accordion-body collapse" style="height: 0px;">
              <div class="accordion-inner">
                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>
          <div class="accordion-group">
            <div class="accordion-heading">
              <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseThree">
                Collapsible Group Item #3
              </a>
            </div>
            <div id="collapseThree" class="accordion-body collapse" style="height: 0px;">
              <div class="accordion-inner">
                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>
        </div>

      </div>
      <div class="body">
      </div>
    </div>

    <script src="http://code.jquery.com/jquery-2.1.3.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
  </body>
</html>
纸哥

就像乔恩说的那样,您使用了错误的类。这是您的更改最少的示例...更改

class="accordion-group"

class="panel panel-default"

http://jsfiddle.net/g1tpwbsy/2/

这是最新的自举式手风琴:http : //getbootstrap.com/javascript/#collapse-example-accordion

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

多个Bootstrap手风琴同时打开和关闭

来自分类Dev

使Jquery Accordion脚本在一页上允许多个手风琴

来自分类Dev

Bootstrap手风琴,单击时滚动到活动(打开)手风琴的顶部?

来自分类Dev

多个手风琴

来自分类Dev

多个手风琴

来自分类Dev

Bootstrap手风琴

来自分类Dev

Bootstrap手风琴

来自分类Dev

角形手风琴-多个打开的组

来自分类Dev

Bootstrap Stay手风琴打开页面重新加载

来自分类Dev

如何才能同时锚定并打开Bootstrap手风琴?

来自分类Dev

Bootstrap手风琴在悬停时打开

来自分类Dev

Bootstrap手风琴选项卡未打开

来自分类Dev

AngularJS / ui-bootstrap手风琴-单击时滚动到活动(打开)手风琴的顶部

来自分类Dev

jQuery从链接打开手风琴

来自分类Dev

首个手风琴面板打开

来自分类Dev

单击保持手风琴打开

来自分类Dev

jQuery手风琴打开/关闭

来自分类Dev

JQuery 手风琴默认打开

来自分类Dev

Bootstrap手风琴未关闭

来自分类Dev

Bootstrap手风琴问题

来自分类Dev

Bootstrap手风琴-全部关闭

来自分类Dev

Bootstrap手风琴面板/折叠

来自分类Dev

Bootstrap手风琴不塌陷

来自分类Dev

Bootstrap手风琴不会塌陷?

来自分类Dev

twitter bootstrap手风琴的bug

来自分类Dev

Bootstrap手风琴箭头颜色

来自分类Dev

Bootstrap手风琴表现怪异

来自分类Dev

Popover内部的Bootstrap手风琴

来自分类Dev

更改 Bootstrap 手风琴配置