- data-toggle="collapse" 添加到您想要展开或折叠的组件的链接上。
- href 或 data-target 属性添加到父组件,它的值是子组件的 id。
- data-parent 属性把折叠面板(accordion)的 id 添加到要展开或折叠的组件的链接上。(一个张开时其他折叠的手风琴效果,简单的折叠用不到)
<div type="button" class="btn btn-primary" data-toggle="collapse" href="#demo">
简单的可折叠组件
</div>
<div id="demo" class="collapse in">
Nihil anim keffiyeh helvetica, craft beer labore wes anderson
cred nesciunt sapiente ea proident. Ad vegan excepteur butcher
vice lomo.
</div>
-
几个被折叠元素的class
- .collapse 隐藏内容。
- .collapse.in 显示内容。
- .collapsing过渡效果开始时被添加,完成时被移除。
-
可通过 JavaScript 激活 collapse 方法,如下所示:
$('.collapse').collapse()
其他方法及事件见文档