jQuery Accessible Carrousel using ARIAは、ARIAを使ったアクセシブルなカルーセルシステムを実装することができるjQueryプラグインです。divやhxによるリストを簡単にカルーセル化できるほか、ファイル容量も通常版で25kb、圧縮版で8kbと、とても軽量に仕上がっているのがいいですね。
セッティングには属性を指定
jQuery Accessible Carrousel using ARIAのデモ動作は以下のページから見ることができます。
デモではカルーセルの両端に前後移動できる矢印ボタンが設置されているほか、下部にはドットによるナビゲーションも備えています。矢印ボタン、またはナビゲーションをクリックすると、スライドしながらコンテンツが切り替わる仕組みです。
シンプルで動作もサクサクしているので、ストレスなくコンテンツを切り替えられますね。
アニメーションはスライドの他にもフェードに設定することも可能です。セッティングに関してはHTMLタグに属性を指定することで、いろいろな設定ができます。data-carrousel-○○といった属性がいろいろ用意されています。例えば、先ほどのアニメーションをフェードにしたい場合は、「data-carrousel-transition=”fade”」という属性を追加してあげます。
他にもいろいろな属性が用意されているので、気になる人はぜひチェックしてみてください。jQuery Accessible Carrousel using ARIAの詳しい使い方やダウンロードは、以下のページからどうぞ。
