CSSの新しいプロパティ「form-sizing: content;」が便利！ フォームのサイズを入力された文字量に合わせて自動変更

2023/10/10 149 users content CSS 新しいプロパティ フォーム 文字量

今まではJavaScriptを使用しないとできなかったことが、たった1行のCSSで簡単に実装できるようになります。フォームのtextareaに文字を入力すると、その文字量に合わせてサイズを自動で変更するCSSの新しいプロパティを紹介します。 下記のように入力された文字量に合わせてサイズを自動で拡張してくれます。また、min-h... 続きを読む

TrelloのDescription欄だけでUIを超えた手触りが良すぎて学びしかない - Make組ブログ

2021/02/27 373 users Trello Description 手触り ToDoリスト

TrelloのUI（UX）が素晴らしすぎます。UIと言っても表面上のデザインだけでなくて、基本的な要素の手触りが良すぎます。 とくに上の写真にあるDescriptionがすごい。ここだけで作り込みがすごすぎてビックリする。 これはカード（Todoリストでいうタスク）の説明欄です。入力はtextareaででき、URLなどが入力されると表... 続きを読む

JavaScript における文字コードと「文字数」の数え方 | blog.jxck.io

2017/03/02 740 users jxck.io 数え方 JavaScript 文字コード 理由

created_at: 2017-03-02 updated_at: 2017-03-02 tags: [ utf-16 , unicode , javascript ] Intro <textarea> などに入力された文字数を、 JS で数えたい場合がある。 ここで .length を数えるだけではダメな理由は、文字コードや JS の内部表現の話を理解する必要がある。 多言語や絵文字対応なども... 続きを読む

JavaScript - Qiitaのtextarea自動補完がOSSになりました - Qiita [キータ]

2013/09/02 266 users 人伝 GitHub キータ Qiita OSS

jQuery.textcomplete（デモ） GitHubのようなtextareaの補完機能を実装する - カーソル位置の取得 を書いたのも今は昔、いつか続きを書こう書こうと思いながら気がつけば5ヶ月が過ぎました なんか続きを書くのが面倒くさくなったのと、某日本最大レシピ共有サイトの技術部長の人から「OSSにして欲しい」という要請を人伝に受け取ったこともあって、OSS化した次第です。 ライセンス... 続きを読む

HTML5のさまざまなform要素があなたのブラウザでどのように見えるかのまとめ -Native form elements | コリス

2013/04/16 101 users コリス Disable Button Option input

HTML5のform要素、input, textarea, select, option, fieldset, legend, label, buttonの各要素とさまざまなタイプをまとめたサイトを紹介します Native form elements 各要素は余計な装飾がない状態で、上がデフォルト、下が入力不可のdisableです。 下記は、Chrome26 for OS XでのHTML5の各フォ... 続きを読む

Rubyによる形態素解析エンジンokura 0.0.1をリリースしました - <s>gnarl,</s>技術メモ”’<marquee><textarea>￥

2012/03/19 167 users Marquee gnarl Ruby 技術メモ

12月にさくさくテキストマイニングで発表したpure Rubyによる形態素解析エンジンをgem化しました｡まだ発展途上で機能が少なかったりパフォーマンスが悪かったりしますが､いちおう動くレベル*1になったので公開します｡ 注意事項バージョン0.0.xのうちは､インタフェースや辞書フォーマットは頻繁に変更される予定です｡ある程度安定したら0.1.0出します｡今のところ､Ruby1.9系専用です｡ 取... 続きを読む

フォームのテキストエリアをより使いやすくするテクニック集 | コリス

2010/07/19 302 users コリス background borde images URL

CSSやJavaScript（jQuery）を使用して、フォームのテキストエリアをより使いやすくする9つのトリックを紹介します。 CSS 画像の表示には、スタイルシートを利用します。 textarea { background: url(images/benice.png) center center no-repeat; /* This ruins default border */ borde... 続きを読む

404 Blog Not Found:javascript - 勝手に添削 - textareaの高さを自動調節

2008/05/20 367 users 添削 JavaScript 自動調節

function resize_textarea(ev){ //if (ev.keyCode != 13) return; var textarea = ev.target || ev.srcElement; var value = textarea.value; var lines = 1; for (var i = 0, l = value.length; i < l; i++){ if (v... 続きを読む

ウノウラボ Unoh Labs: 携帯サイト作成時の注意点(au編)

2006/11/16 277 users ウノウラボ Unoh Labs メーラ mailto au編

こんばんは。harukです。 前回のSoftBank編に続き、今回はau編です。 なお、HDMLに関しては扱ったことがないため、含まれていません。 mailtoに半角カタカナは使えない 半角カタカナを受け付けない端末があり、その端末ではメーラが起動してくれません。 テキストボックスに改行が入力できる auはテキストボックスでもtextareaと同じように改行が普通に入力できます。 テキストボックス... 続きを読む

Ajax IME ブックマークレット

2006/10/16 157 users Ajax IME 経由 ブックマーク 2秒ほど 入力

Ajax IME ブックマークレットを作ってみました．右クリックしてブックマークに登録してみてください． Ajax IME ブックマークにアクセスするだけで現在表示しているページにある textarea と inputbox が Ajax IME 経由で入力可能になるはずです．成功すれば2秒ほどで textarea の色が変わって Ajax IME 入力状態になります．Alt-O で元に戻ります．... 続きを読む

フォームのtextareaをより使いやすくすることが出来る「Textarea tools」:phpspot開発日誌

2006/10/04 152 users CSS phpspot開発日誌 アニメーション 実装 フォーム

CSSとJavaScriptでアニメーションがカッコいいメニューを実装「FreeStyle Menus」 次の記事 »：OPMLアイコンプロジェクト Textarea tools Small collection of tools for use with textareas (or input fields). フォームのtextareaをより使いやすくすることが出来る「Textarea too... 続きを読む

テキストエリアとかリサイズ可能にする JavaScript

2006/08/25 211 users リサイズ テキストエリア JavaScript スクリプト

■ テキストエリアとかリサイズ可能にする JavaScript 好評の、読み込ませるだけシリーズ の6番目。 このスクリプトを読み込ませるだけで、ウェブ上にある TEXTAREA とかその他色々好きな要素がリサイズ可能なやつに大変身。とりあえずサンプル見るのが手っ取り早いです。 実際の動作サンプル テキストエリアの右下にマウスカーソルを持っていくとカーソル形状がかわるので、そのままドラッグするとサ... 続きを読む