[CSS]グラデーションのアニメーションが美しいフォームを実装するスタイルシート
Glowform デモページ [ad#ad-2] CSS3のグラデーションとアニメーションを使用しているため、対応ブラウザはWebkit系（Chrome, Safari）、Firefox4となります。 テキストフィールドにフォーカスすると、グラデーションはアニメーションで美しく変化します。 [ad#ad-2] HTML HTMLは、下記のようになっています。 スタイルシートやスクリプトはサイトの「Download」からダウンロードできるので、そちらでご確認ください。 <div class="rain"> <div class="border start"> <form> <label for="email">Email</label> <input name="email" type="text" placeholder="Email"/> <label for="pass">Passwo
HTML5のplaceholder属性をjQueryでやってみる
追記：HTML5のplaceholder属性を代替するjQueryプラグイン(ah-placeholder.js) ここと同じ内容のことをjQueryプラグインの体裁に整えたものを，GitHubで公開してます．詳しくは上の記事をご参照のこと． 4.10.7.2 Common input element attributes — HTML5 (including next generation additions still in development) HTML5のinput要素には、placeholder属性があります。input要素に、placeholder属性でテキストを書くと、下のような感じの表現が可能になります。今のところOpera・Safari・Chromeでは、ネイティブに記述しても解釈してくれるようです。 ただし、XHTML 1.1や、HTML 4.01のDTDを宣言した
[jQuery]フォームの入力欄にデフォルトで文字列を入れておいてフォーカスしたら消す | バシャログ。
テキストフィールドの入力欄に「キーワードを入力してください」とかデフォルトで入れておいて、フォーカスした時に消す、というインターフェースを簡単に実装する jQuery のプラグインをご紹介します。 jquery.fieldtab.js 導入はとても簡単です。 まずは上記のサイトから「jquery.fieldtag.js」をダウンロード。 次に HTML の head 内に以下のコードを。#hoge のところは適用したいテキストフィールドの id を入れます。 <script type="text/javascript" src="jquery.fieldtag.js"></script> <script type="text/javascript"> /* <![CDATA[ */ $(function(){ $("#hoge").fieldtag(); }); /* ]]> */ </s
![[jQuery]フォームの入力欄にデフォルトで文字列を入れておいてフォーカスしたら消す | バシャログ。](https://cdn-ak-scissors.b.st-hatena.com/image/square/6a7c7828e73c1691039a9aa0dce7f4c767e36c92/height=288;version=1;width=512/https%3A%2F%2Fbashalog.c-brains.jp%2Fimages%2Fcat_javascript.png)
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
