<link rel="stylesheet" href="css/accordion.css">
<script src="js/accordion.min.js"></script>
<div class="accordion-container">
<div class="ac">
<h2 class="ac-q" tabindex="0">アコーディオン1</h2>
<div class="ac-a">
<p>コンテンツ1</p>
</div>
</div>
<div class="ac">
<h2 class="ac-q" tabindex="0">アコーディオン2</h2>
<div class="ac-a">
<p>コンテンツ2</p>
</div>
</div>
<div class="ac">
<h2 class="ac-q" tabindex="0">アコーディオン3</h2>
<div class="ac-a">
<p>コンテンツ3</p>
</div>
</div>
</div>
<script>
new Accordion('.accordion-container');
</script>
var accordion = new Accordion({
duration: 600, // animation duration in ms {number}
itemNumber: 0, // item number which will be shown {number}
aria: true, // add ARIA elements to the HTML structure {boolean}
closeOthers: true, // show only one element at the same time {boolean}
showItem: false, // always show element that has itemNumber number {boolean}
elementClass: 'ac', // element class {string}
questionClass: 'ac-q', // question class {string}
answerClass: 'ac-a', // answer class {string}
targetClass: 'ac-target' // target class {string}
});
var accordion = new Accordion({
onToggle: function onToggle() {}
});