テキストボックスを自動で収縮するjavascript「Resizing textarea」

フォームを作成する際のテキストボックスの適切な大きさで悩むことがあります。
文字数にあわせて自動で収縮すればこんな悩みもなくなります。
Resizing form textbox example using Prototypeはprototypeベースで作成された自動収縮テキストボックス作成用スクリプトです。

使用方法
ResizeTextBox.jsとprototypeからprototype.jsをダウンロードします。

<script src="http://yourdomain/prototype.js" type="text/javascript"></script>
<script src="http://yourdomain/ResizeTextBox.js" type="text/javascript"></script>
上記をhead内に書き込み、textareaのonFocusに"new ResizingTextArea(this);"を付与します。
テキストボックスを自動で収縮するjavascript「Resizing textarea」サンプル

2007年10月07日

前の記事：faviconを表示するjavascript「Hyperlink Cues with Favicons」
次の記事：色を選択するカラーピッカーjavascript「Mootools Colo(u)r picker」

関連記事

• [prototype]DateChooser
• パスワード強度を視覚的に明示するjavascript「Password Strength」
• セレクトボックスを装飾するjavascript「Select Box」
• JavaScriptライブラリ「jQuery」を使用してフォームを華麗に彩る「jqTransform」
• ビジュアル面で最高のタイムピッカーJavaScript「nogray_time_picker」

• ファイルサイズをJavaScriptライブラリ「jQuery」で自動表示する「addSizes.js」
• JavaScriptライブラリ「jQuery」を使用してフォームを華麗に彩る「jqTransform」
• Webカラーに関するサイト21
• 英字新聞ぽいコラムをJavaScriptライブラリ「jQuery」で作る「Columnizer」
• 心地よく要素を切り替えるJavaScript「jFlip」
• CoverFlowを実現するJavaScript「JS Coverflow」
• 画像を丸く輝かせるJavaScript「sphere.js」
• セクシーなLightBoxを実現するJavaScript「Sexy LightBox」
• JavaScriptライブラリ「jQuery」を使ってカレンダーを作る「jCal.js」
• カバーフローぽい画像ギャラリーJavaScript「ProtoFlow」