本年もどうぞよろしくお願いいたします。
新年一発目の記事がすっかり遅くなってしまいました。
昨年はITニュース関連の記事が多くなってしまいましたが、今年はウェブ技術の実践をなるべく充実させていきたいなぁと考えています。
ウェブ技術の実践ページが増えれば、後々自分にとっても技術や表現のリンク集代わりに使えますので。
というわけで更新ペースは昨年より更に落ちるかと・・・＾＾；
さて、今回は入力フォームの見栄えをよくするスクリプトを試してみました。
実践ページはこちらになります。
フォームの見栄えを良くするスクリプトを試してみた
CSS、Javascript、画像を使って見栄えのする入力フォームを実現するものです。
導入方法はとても簡単です。
１．必要なファイルのダウンロード＆設置
ファイル一式をこちらからダウンロードして任意の場所にアップロードしてください。
※
バージョンによってデザインが違います。
それと、Emblematiq :: Niceforms :: Supportの７に書かれているようにIE6では正常に動作しないようです。
７を読むとどうやら意図的にそうしているようですね。
２．jsとcssの読み込み
HTMLに
<link rel="stylesheet" type="text/css" href="（アップロードしたディレクトリ）/niceforms-default.css">
<script type="text/javascript" src="（アップロードしたディレクトリ）/niceforms.js"></script>
を記述します。
３．classの指定
使いたいフォームのformタグ内に
class="niceform"
を指定します。
設定は以上です。
４．最後に
画像を自分で作って差し替えれば、好みのデザインにする事が可能です。
cssやjsを触らないのであれば画像のサイズは元画像のサイズに合わせた方が無難かと思います。
今回の入力フォームにseekAttentionなどを組み合わせたらおもしろいかもしれませんね＾＾
seekAttentionについては
seekAttention - 注目させたい部分を強調させるスクリプト
を参考にしていただけたらと思います。
何かしら参考になりましたらクリックをよろしくお願いします
さきほどは来て頂いてありがとうございました。
いつもながら、
詳細で
役に立つ
質の高い 記事内容
感銘しています。
本年もどうぞよろしくお願いいたします。
ミミオでございます。
今年のテーマはとっても楽しみです。
ミミオのサイトは素人色満載のサイトなので、こちらで勉強させていただいて、サイト作りに役立てたいと思います。
今年もよろしくお願いします。
明けましておめでとうございます。
今年もよろしくお願いいたします m(_ _)m
metaboyさんのブログ、ものすごい情報量になってきていますね！
IT関連の情報源としてこれからもお邪魔させていただきます＾＾
>> ミミオさん
明けましておめでとうございます。
今年もよろしくお願いいたします m(_ _)m
今年はウェブサイト構築に使えそうな技術をここにたくさん集められたらと思っています＾＾
ますます寒さも厳しくなってきましたが、トモヒロさんお風邪などひかれませんように。
ありがとうございます。
そう言っていただけるととてもはげみになります m(_ _)m
愛美さんも体調など崩されないよう適度に頑張ってください＾＾
また、遊びにきますヾ(=^▽^=)ノ
応援ポチッ♪しておきますね！