【ハウツー】

ゼロからはじめるFancyForm - フォームやラジオボタンをグラフィカルに

1 FancyFormとは?

    古籏一浩  [2008/03/19]

    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のように手軽には設定できません。

    新着記事

    特設サイトの情報

      人気記事

      一覧

      新着記事

      特別企画

      マイナビニュースマガジン