カテゴリー:
html
タグ:
 html html5

このエントリーをはてなブックマークに追加
更新日時:
2012年12月24日(月)
作成日時:
2012年12月24日(月)

前の記事 / 次の記事

HTML5 & CSS3 Support

html5のplaceholderはIEでは対応してないっぽいので解決策を探る。

【参考サイト】

jQuery-Placeholderプラグインをダウンロードして設置して設定をする。
要jQuery。

ダウンロード&設置

$ git clone git://github.com/danielstocks/jQuery-Placeholder.git
$ cd jQuery-Placeholder

jquery.placeholder.js と README.rst 以外は不要なので消す。
(minを残さないのはどうせRails3以上だとプリコンパイルされるから。)

設置はJavaScriptを読み込める好きな場所に。

設定

プラグインの呼び出しとスタイル書く。
適当なJavaScriptファイルにプラグインの呼び出しを定義する。

# coffee script
$ ->
  $("input[placeholder], textarea[placeholder]").placeholder()

適当なスタイルシートファイルに文字列の表示色を定義する(しなくてもいい)。

// sass
.placeholder
  color: #999999

備考

  • placeholderが使えない場合のみJavaScriptで処理される
  • もう一つ良さそうなプラグインでah-placeholderというのがあったけど、
    これはパスワード入力欄がある場合は使えなかった(●●●●●●になる)。