Follow Us.RSS

Re[5]:アンケートフォームで入力中の項目をフォーカスする方法

  • 新規投稿
  • ログイン

アンケート(フォームメール)Re[5]:アンケートフォームで入力中の項目をフォーカスする方法

いつも丁寧に解説いただき誠にありがとうございます。

メールフォームにつき、私は以下の様に設定を変更しました。
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
/* コメントボックスの各項目をマウスオーバーした際に、フォーカスしている事が分かる様にフレーム枠の色を変化 */
input,
textarea {
border-color: #eee #eee #eee #eee;
background-color: #ebebeb;
}
input:hover,textarea:hover {
border-color: #00a0dd; /* マウスオーバーされたときの疑似クラス */
background-color: #cdcdcd;
}
input:focus,textarea:focus {
border-color: #aaa; /* フォーカスされたときの疑似クラス */
background-color: #cdcdcd;
}
td.field-name strong {
color: #CC0066; /* 必須項目を色づけ */
}
td.field-name strong:after {
content: "*"; /* 必須項目名の後ろにアスタリスクをつける */
}

↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑
おかげさまで入力時の必須項目がひと目で分かるようになりました^^

私のメールフォームのページは【必須項目制御】を使って・・・たとえば『資料請求』『問い合わせ』が出来るようになっており、

  1. 問い合わせ内容(資料請求か問い合わせを選択)
  2. お名前(デフォルト設定:必須 ○)
  3. 住所(デフォルト設定:必須 ×)
  4. コメント(デフォルト設定:必須 ×)

としてあります。

そして資料請求の際は『住所』を必須にし、問い合わせの際は『コメント』を必須になるよう設定してあります。

その際に内容に応じて、必須項目には色と必須項目名の後ろに『※』がつくことで非常に視覚的に分かりやすくなっております。これは非常に使ってみて良かったので、フォーラムをご覧の方も参考にしていただければと思いました。
m(_ _)m

グラファイト-ショボン
  • 王将
  • Windows Vista/Firefox3.0
  • 2009年3月8日(日) 14時55分49秒
タイトルは内容を簡潔にまとめたものにしてください。
「質問です」などのタイトルで投稿することはできません。
アイコン
この E-Mail は表示されません。
添付ファイル
(< 1000000 byte)
サイズ (<800) × (<800) ピクセル
ユーザー環境MacOS X/AppleWebKit537.36
  • 新規投稿
  • ログイン