[JS]セレクトボックスをアクセシブルでスタイリッシュにするスクリプト -Stylish Select
Post on:2010年1月22日
sponsors
簡単にフォームのセレクトボックスのデザインをスタイリッシュに変更するスクリプトを紹介します。
スクリプトはクロスブラウザ対応で、キーボード操作にも対応したアクセシブルなものとなっています。
バリエーションも豊富です。
optgroupのグループ化にも対応。
CSSを変更した、WindowsXPのスタイル。
高さの上限値を設定（max:300px）
設置方法は簡単で、スクリプトを外部ファイルとして記述し、下記のようにスクリプトにセレクトボックスを指定し、オプションなどを記述するだけです。
|
1 2 3 4 5 |
<textarea name="code" class="js" cols="60" rows="5"> $(document).ready(function(){ $('#my-dropdown').sSelect(); }); </textarea> |
Stylish SelectはjQueryのプラグインのため、実装にはjquery.jsが必要です。
sponsors
