accordion-init v1.0.0

accordion-init

Pure javascript library to use without any complex libraries

version

v1.0.0

usage

Include js, css, and img files. You can use minified js files for production usages.

install the package

npm install accordion-init

Include files to use

<link rel="stylesheet" href="dist/css/accordion.min.css">
<script src="dist/js/accordion.min.js"></script>  

Add HTML Template in .html file

<div class="accordion-container">
	<div class="panel">
		<div class="heading">Panel Title</div>
		<div class="content">
			<p>
				Content
			</p>
		</div>
	</div>
	<div class="panel">
		<div class="heading">Panel Title</div>
		<div class="content">
			<p>Content</p>
		</div>
	</div>
	<div class="panel">
		<div class="heading">Panel Title</div>
		<div class="content">
			<p>Content</p>
		</div>
	</div>
</div>

Create accordion in javascript

<script type="text/javascript">
	var accordion = new Accordion('.accordion-container');
</script>

Add HTML Template in .html file of your angularjs

	$scope.accordion = new Accordion('.accordion-container');

If you're getting your content from server and takes a delay you should $timeout function.

	$timeout(function() {
		$scope.accordion = new Accordion('.accordion-container');
	});

API

Example

new Accordion(element, newSettings)

— element - string (obligatory), the html element you want to init as an accordion panel — newSettings - object (optional), accordion settings you want to use. Check them in the following content

Settings