Laravel5:JQuery Collapse

Laravel 官方 Document 中,关于 collapse 的用法没有介绍得非常清晰。

研究了许久,终于弄出来一个 collapse 模板,可以实现多 panel 联动。

<div id="accordion"  aria-multiselectable="true">
	<div class="panel">
		<a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true">
			Collapsible Group Item #1
		</a>
		<div id="collapseOne" class="collapse in">
			<ul class="layer2 list-group">
				<li><i class="fa fa-circle-o"></i><a>Chapter 1</a></li>
				<li><i class="fa fa-circle-o"></i><a>Chapter 2</a></li>
			</ul>
		</div>
	</div>
	<div class="panel">
		<a role="button" class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false">
			Collapsible Group Item #2
		</a>
		<div id="collapseTwo" class="collapse" >
			<ul class="layer2 list-group">
				<li><i class="fa fa-circle-o"></i><a>Chapter 1</a></li>
				<li><i class="fa fa-circle-o"></i><a>Chapter 2</a></li>
			</ul>
		</div>
	</div>
</div>

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.