テキストサイズに応じてtextareaを自動でサイズ調整してくれるjQueryプラグイン「jQuery.elastic」
2010年06月22日-
スポンサード リンク
jQuery.elastic
テキストサイズに応じてtextareaを自動でサイズ調整してくれるjQueryプラグイン「jQuery.elastic」。
普通テキストエリアというと、サイズは固定で、長い文書を入れると最初の方にいれたテキストがわかりにくくなってしまいますが、改行を入れると自動でテキストエリアが広がるあの便利な機能をjQueryで実現出来ます。
テキストサイズに応じて伸縮します。

改行を入れると縦に広がります。最初に入れた文書も確認しつつ長文を入力できます。

実装の方法は無茶苦茶簡単。
$('textarea').elastic();
textareaはデフォルトでこの動きになって欲しいですが、このプラグインがあれば1行で全てのtextareaを自動伸縮させることが出来ますね。
関連エントリ
テキストサイズに応じてtextareaを自動でサイズ調整してくれるjQueryプラグイン「jQuery.elastic」。
普通テキストエリアというと、サイズは固定で、長い文書を入れると最初の方にいれたテキストがわかりにくくなってしまいますが、改行を入れると自動でテキストエリアが広がるあの便利な機能をjQueryで実現出来ます。
テキストサイズに応じて伸縮します。

改行を入れると縦に広がります。最初に入れた文書も確認しつつ長文を入力できます。

実装の方法は無茶苦茶簡単。
$('textarea').elastic();
textareaはデフォルトでこの動きになって欲しいですが、このプラグインがあれば1行で全てのtextareaを自動伸縮させることが出来ますね。
関連エントリ
スポンサード リンク
Advertisements
SITE PROFILE
最新のブログ記事(新着順)
- 2000個近いフリーのピクトグラムアイコン「tabler-icons」
- ページスクロールで背景ムービーが動くページが作れる「ScrollMovie」
- テキストがシャッフルされてかっこいいMENU実装
- 手書き風ピクトグラムアイコン400種「Doodle Icons」
- 色のカスタマイズやブレンドをできるオンラインツール「hue.tools」
- JSを一切使わないCSSでできたドロップダウンなどのUI実装「CSSUI」
- ダークモードにも対応したシンプルなページ作成に使える「Simple.css」
- Three.jsで画像をピクセルっぽくゆがめるサンプル
- スクロールに応じて3Dオブジェクトが動作するThree.jsを使ったデモ
- 丸文字が可愛いフリーフォント「ZEN丸ゴシックN」
- 過去のエントリ