SimpleAccordionは、シンプルなアコーディオンを実装することができるjQueryプラグインです。見出しをクリックすると、サッとさりげないフェードでコンテンツが表示されます。複雑な機能を必要とせず、シンプルで手軽に実装可能なアコーディオンを探している人にオススメです。
SimpleAccordion
以下、SimpleAccordionの実際のデモページです。
デモでは3つのテキスト項目が並べられており、各項目をクリックするとフェードでコンテンツが表示されます。再度、見出しをクリックするとコンテンツが非表示になる仕組みです。
コンテンツが表示される時のフェードアニメーションがとてもさりげない感じなのがいいですね。複雑な機能や余計な装飾などもなく、シンプルで簡単な操作性のアコーディオンに仕上がっています。
コンテンツが表示されている時は、そのコンテンツの見出しのカラーが変わっているので、どの見出しに対応したコンテンツが開かれているのか瞬時にわかります。
また、1番上の見出しの上に設置されている2つのボタンから、全表示・全非表示を実行することも可能です。
ちなみに、全表示するボタンには「.showall」、全非表示にするボタンには「.hideall」のクラスを付与します。そのほか、見出しには「.acchead」、コンテンツ（本文）には「.accbody」のクラスを使用します。
それ以外にも、「.accopen」や「.rotate」といったクラスもあるので、気になる人はぜひチェックしてみてください。
というわけで、シンプルで操作性も簡単なアコーディオンを実装できるjQueryプラグイン「SimpleAccordion」のご紹介でした。SimpleAccordionの詳しい使い方やダウンロードは、以下のページからどうぞ。
