FancyFormはWebサイトの入力フォームのラジオボタンとチェックボックスをグラフィカルなものに変更するライブラリです。

入力フォームのエレメント(部品)は使用しているOSや環境により異なります。このため、ページデザインを行なう際に、入力フォーム部分だけ統一感が失われてしまうことがあります。入力フォームの部品をページデザインに沿ったものにすることができればページの統一感が失われることはありません。

FancyFormはラジオボタンとチェックボックスのみグラフィカルなものにしますが、バージョンが上がれば、その他のエレメントもグラフィカルなものに変更することができるようになるかもしれません(*1)。

関連ファイルを入手する

FancyFormはこのURLにあるページからダウンロードすることができます。

FancyFormの公式サイト

FancyFormのバージョンをクリックするとダウンロードされる

「FancyForm v0.92」と書かれた文字をクリックするとダウンロードが行われます。ダウンロードされたファイルはZIP形式になっているので解凍します。解凍すると以下のファイル構成になります。

解凍後の状態

ここで必要になるのはfancy-formフォルダ内にあるreadme_filesフォルダの以下のファイルです。

chk_off.png
chk_on.png
moocheck.js
mootools.js
rdo_off.png
rdo_on.png

また、このままでは正しく表示されないためスタイルシートを設定する必要があります。

*1 Yahoo UI Libraryでも入力フォームのエレメントをグラフィカルなものに変更することができます。Yahoo UI Libraryではより多くのエレメントをグラフィカルなものにできますが、FancyFormのように手軽には設定できません。