textarea を自動的にリサイズする

javascript

最近のウェブアプリでは当たり前のように使われている textarea の入力項目を自動的にリサイズする方法を調べたのでメモ。
Autosize というのを使えば簡単に実装できるようです。

いつも通りの cdnjs を使う場合にはこんな感じで OK。

<script src="https://cdnjs.cloudflare.com/ajax/libs/autosize.js/3.0.18/autosize.min.js"></script>
<script>
autosize(document.querySelectorAll('textarea'));
</script>

CSS で min-height や max-height を指定すると最小、最大を設定することができます。
最大を超えた場合にはスクロールバーが出現するようになっています。

by hsur at 22:33 [5年前][4年前][3年前][2年前][1年前][1年後][2年後][3年後][4年後][5年後] |

こんな記事もあります「cdnjs 'textarea' max-height」

・気象庁から json でデータが取得できるようになってる
・clipboard.js でウェブサイトにクリップボードにコピーボタンを作る
・シンプルな DateTime ピッカー「jQuery Date/Time Entry」
・jquery.quicksearch で HTML をリアルタイムに絞り込み
・1900 種類以上のライブラリを配信している CDN 「jsdelivr」
・2576個の JavaScript ライブラリを配信している CDNJS
・link_to_remoteを使ってテキストフィールドをupdateする
・tracの通知メールをカスタマイズしてみる
・JavaScriptからクリップボードの中身を書き換える
・エディタに機能ボタン追加 (FireFox対応)

トラックバックについて

Trackback URL:

お気軽にどうぞ。トラックバック前にポリシーをお読みください。[policy]

このエントリへのTrackbackにはこのURLが必要です→https://blog.cles.jp/item/8929

Trackbacks

このエントリにトラックバックはありません

Comments

愛のあるツッコミをお気軽にどうぞ。[policy]
古いエントリについてはコメント制御しているため、即時に反映されないことがあります。

コメントはありません

Comments Form

コメントは承認後の表示となります。
OpenIDでログインすると、即時に公開されます。

OpenID を使ってログインすることができます。

« MySQL で implode() のようなことがしたい :: 向島百花園のカワセミ »

サイト内検索

検索ワードランキング

へぇが多いエントリ

換気口に風よけカバーを設置 (2)

閲覧数が多いエントリ

1 . アーロンチェアのポスチャーフィットを修理(1022)
2 . 福岡銀がデマの投稿者への刑事告訴を検討中(984)
3 . svn でコミットしたらエラーが出たので(935)
4 . シャープの空気清浄加湿器のキュルキュル音対策は PTFE テープで(870)
5 . RT810 の DHCP サーバを WPAD に対応させる(844)

cles::blog

textarea を自動的にリサイズする