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. Image Tilt Effect

    JavaScript

    画像にチルトエフェクトをかけることができる「Image Tilt Effect」

    Image Tilt Effectは画像にチルトエフェクトをかけたちょ…

  2. jQuery Accordion

    JavaScript

    シンプルで実用的なアコーディオン実装「jQuery Accordion」

    とてもシンプルで操作性のよいアコーディオン「jQuery Accord…

  3. PreViewTube.js
  4. JavaScript

    スクロール時にナビゲーションが上部に固定されるレスポンシブ対応のjQueryプラグイン「HeadSh…

    スクロールするとナビゲーションが上部に固定配置されるjQueryプラグ…

  5. 4PXMMenu

    JavaScript

    滑らかなアニメーションでモバイルサイトに最適なメニュー実装「4PXMMenu」

    4PXMMenuはモバイルサイトに最適なメニューを実装することができる…

  6. Image Figure Caption effects

最近の記事

  1. オリジナルチキン6ピース
  2. 200-DGCAM019
  3. ハクバ GW-PRO RED フォトグローブプロ PL
  4. Soundcore Liberty Air 2

アーカイブ

PAGE TOP