所以我的页面上有一个bootstrap风格的手风琴 – 但是一开始,第一个面板是打开的.
如何才能使它在加载页面时全部关闭?
如何才能使它在加载页面时全部关闭?
任何帮助将非常感激!非常感谢!
<div class="panel-group" id="accordion"> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a class="accordion-toggle text-normalize" data-toggle="collapse" data-parent="#accordion" href="#panel1"><i class="fa fa-minus text-primary"></i> Overview</a> </h4> </div> <div id="panel1" class="panel-collapse collapse in"> <div class="panel-body">Contents panel 1</div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a class="accordion-toggle text-normalize" data-toggle="collapse" data-parent="#accordion" href="#panel2"><i class="fa fa-plus text-primary"></i> Utilities</a> </h4> </div> <div id="panel2" class="panel-collapse collapse"> <div class="panel-body">Contents panel 2</div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a class="accordion-toggle text-normalize" data-toggle="collapse" data-parent="#accordion" href="#panel3"><i class="fa fa-plus text-primary"></i> Organization</a> </h4> </div> <div id="panel3" class="panel-collapse collapse"> <div class="panel-body">Contents panel 3</div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a class="accordion-toggle text-normalize" data-toggle="collapse" data-parent="#accordion" href="#panel4"><i class="fa fa-plus text-primary"></i> Integrations</a> </h4> </div> <div id="panel4" class="panel-collapse collapse"> <div class="panel-body">Contents panel 3</div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a class="accordion-toggle text-normalize" data-toggle="collapse" data-parent="#accordion" href="#panel5"><i class="fa fa-plus text-primary"></i> Essentials</a> </h4> </div> <div id="panel5" class="panel-collapse collapse"> <div class="panel-body">Contents panel 3</div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a class="accordion-toggle text-normalize" data-toggle="collapse" data-parent="#accordion" href="#panel6"><i class="fa fa-plus text-primary"></i> Sales</a> </h4> </div> <div id="panel6" class="panel-collapse collapse"> <div class="panel-body">Contents panel 3</div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a class="accordion-toggle text-normalize" data-toggle="collapse" data-parent="#accordion" href="#panel7"><i class="fa fa-plus text-primary"></i> Support</a> </h4> </div> <div id="panel7" class="panel-collapse collapse"> <div class="panel-body">Contents panel 3</div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a class="accordion-toggle text-normalize" data-toggle="collapse" data-parent="#accordion" href="#panel8"><i class="fa fa-plus text-primary"></i> Projects</a> </h4> </div> <div id="panel8" class="panel-collapse collapse"> <div class="panel-body">Contents panel 3</div> </div> </div> </div>
解决方法
只需从panel1中删除.in即可.
<div id="panel1" class="panel-collapse collapse"> <div class="panel-body">Contents panel 1</div> </div>