2008年02月21日

テキストエリアのリサイズ @ ウェブ

テキストエリアの自動拡張はどうも具合悪いことがあるようなので、自動ではなく、自分でサイズ変更する方法を探してみました。
TextArea Resizerと言うモノがjQueryプラグインで有り、思った通りのモノのような気がします。自動でサイズが変わらない代わりに余計なイベントが発生しないので、処理速度の遅いマシンでも負担がないような気がします。

TextArea Resizer | jQuery Plugins
>>関連リンク

jQuery textarea resizer plugin
>>関連リンク

使い方はTextArea Resizerのページにもあるのですが、スタイルシートを一々書くのは面倒なので、textarearesizer.cssとしてまとめました。ヘッダーに追加した内容は、以下のような感じです。

<script type="text/javascript" src="/js/jquery-1.2.3.min.js"></script>
<script type="text/javascript" src="/js/jquery.textarearesizer.compressed.js"></script>
<link href="/js/textarearesizer.css" rel="stylesheet" type="text/css" media="all" />
<script type="text/javascript">
<!--
$(document).ready(function() {
$('textarea.resizable:not(.processed)').TextAreaResizer();
});
//-->
</script>

あとはサイズを変更できるようにしたいテキストエリアに class="resizable"を追加するだけ。

閲覧数: 4316 / はてなブックマークusers

関連商品

amazon.co.jp・詳細ページへ

blog comments powered by Disqus

関連日記

アマゾン広告

この日記ページは閲覧数などの条件に応じて、閲覧制限を行っています。他からリンクしていただいても、そのリンクから辿った閲覧者が当ページの内容をご覧頂けない場合があります。ご了承下さい。

▼日記検索

Mac

Shade

3D

Flash

ゲーム

ウェブ

音楽

映画

デジカメ

Windows

Linux

携帯電話

テレビ

広島

電子工作

iOS

▼ 最近のトラックバック

▼ランキング

▼関連サイト