[JS]パネルがスムーズにスライドするアクセシブルなスクリプト
Post on:2009年1月9日
ニュースなど複数のコンテンツを配置したパネルがスムーズにスライドする、アクセシブルで軽量(3KB)なスクリプト「Accessible News Slider」を紹介します。

パネルはリスト要素で実装されており、テキストリンクと画像リンクでスムーズにスライドし、「view all」をクリックするとパネルの全内容を表示します。

「view all」でパネルの全内容を表示
また、アクセシビリティにも配慮されており、WCAG 1.0のアクセシビリティの必要条件を満たして実装しているとのことです。
スクリプトやスタイルシートのオフ時は下記の表示になります。

スクリプトのオフ時の表示

スタイルシートのオフ時の表示
Accessible News SliderはjQueryのプラグインのため、実装にはjquery.jsが必要です。
sponsors