HR Accordion Tab

Responsive Accordion tab, easy to use with best customizable option, and free to use.

Features

• Responsive - All devices compatible
• All Major Browser Compatible
• Extend Multiple Tabs / or Single Tab at a time
• Animated Accordion
• Lightweight JS only (1.6kb)

Include these files on

<link rel="stylesheet" href="css/hr.accordion.min.css">
<script src="js/1.11.2.jquery.min.js"> </script>
<script src="js/hr-accordion.min.js"> </script>

Add HTML Structures

<div class="hr-accordion-wrapper">
	  <div class="each-acc-row">
		<div class="accordion-title"><span class="title">Your title here</span></div>
		<div class="accordion-content"> Your content here	</div>
	  </div>
	  <div class="each-acc-row">
		<div class="accordion-title"><span class="title">Your title here</span></div>
		<div class="accordion-content"> Your content here	</div>
	  </div>
</div>

jQuery

	$(".example1").hrAccordion({ 
		multiple : true, //true,false
		title : true,
		event : 'click', // click, 'mouseover' or any JS events
		speed : 800 // slow, medium, fast, or in milliseconds
	});

Examples:

Demo 1 : Expend multiple tabs

Demo 2 : Expend single tab

If you like my work buy me a cup of coffee 😊

---

About Author

Hidayt Rahman