NO IMAGE

JavaScript

WAI ARIAに準拠したアクセシブルなアコーディオン「ARIA ACCORDION」

ARIA ACCORDIONは、WAI ARIA 1.1に準拠したアクセシブルなアコーディオンを実装することができるjQueryプラグインです。圧縮版で5KB程とファイル容量も軽量で、カスタマイズ性にも優れています。

SASS・SCSSファイルも用意

ARIA ACCORDION

デモでは垂直型のアコーディオンが2つ(グループ1とグループ2)設置されています。タイトル部分をクリックするとコンテンツが表示される仕組みです。

新しいコンテンツが開かれると、現在開かれているコンテンツが同時に閉じられます。操作性も簡単でとても見やすいアコーディオンです。

シンプルで素早くUIをカスタマイズするための、SASS・SCSSファイルも用意されているほか、多彩なオプション設定も可能です。

主なオプション項目は、accGroupClass、accClass、accHeadClass、accHeadingClass、accBtnClass、accCollapseClass、accContentClass、accExpandedClass、accBtnExpandedClass、accCollapseExpandedClass、accContentRole、fadeSpeed、expandOnPageLoad、expandOnlyOne、keyInteractionなどがあります。

アコーディオングループの設定やフェードスピードの調節など、細かいセッティングをオプションから手軽にカスタマイズ可能です。

というわけで、WAI ARIA準拠のアクセシブルなアコーディオンを実装したいという人は、ぜひ「ARIA ACCORDION」を活用されてみてはいかがでしょうか? ライセンスはMITとのこと。

関連記事

  1. jquery.confirm

    JavaScript

    jQueryとBootstrapを使ったボタンとリンクによるダイアログ実装「jquery.confi…

    jquery.confirmは、ページ内のボタンやリンクをクリックする…

  2. jQueryでウィンドウサイズによって処理を変える

    JavaScript

    jQueryでsetTimeoutを使えば各要素のアニメーションを実行させる時間を調整できる

    jQueryのsetTimeoutを使えば何秒後に実行するかといったこ…

  3. Filterable Product Grid
  4. OneBook3d

    JavaScript

    フォトアルバム(ブック)に最適なjQueryプラグイン「OneBook3d」

    OneBook3dはブラウザ上でフォトアルバム(ブック)を作るのにとて…

  5. jsPanel3

    JavaScript

    多機能なフローティングパネルを実装できるjQueryプラグイン「jsPanel3」

    jsPanel3は、高度で多機能なフローティングパネル(ウィンドウ)を…

  6. no-image

    JavaScript

    シンプルでパワフルなセレクトボックスを実装できる「SelectPage」

    SelectPageはシンプルながらも高いカスタマイズ性を備えたパワフ…

最近の記事

  1. USB-2H401BKN
  2. Dyson Pure Cool Me
  3. ルック セレクション
  4. シルキーウインドモバイル

アーカイブ

PAGE TOP