コピペで簡単！ CSSのみで、フォームの入力時にフロートする入力欄のラベルを実装するテクニック

2023/07/09 28 users CSS コピペ ラベル span テクニック

フォームの入力欄のラベルが入力時にふわりとフロートして移動するのをCSSのみで実装するテクニックを紹介します。 HTMLはinputとlabelで非常にシンプル、余計なspanなどはありません。ラベルのフロートはCSSで...記事の続きを読む 続きを読む

CSSの疑似クラス「:focus-within」が素晴らしい理由 | コリス

2020/11/17 199 users セレクタ コリス 意訳 CSS フォーカス

CSSの疑似クラス「:focus-within」を使用して、フォームの入力時にハイライト表示させるテクニックを紹介します。 :focus-withinは適用した要素の子孫要素にフォーカスに当たった時に起動するセレクタで、効果的に使用すると非常に便利です。 Why CSS :focus-within is amazing by Chris Bongers 下記は各ポイントを意訳... 続きを読む

Firefox 75で導入されたアドレスバーの拡大/縮小仕様、てんかんの引き金になると報告を受け対応 | スラド オープンソース

2020/06/15 11 users スラド Bugzilla 引き金 てんかん Mozilla

Firefox 75ではアドレスバーにフォーカスへの入力時、自動的にアドレスバーが拡大表示されるといった仕組みが導入されたのだが、この挙動に対しててんかん発作の引き金になるとの指摘が出ている（MozillaのBugzilla）。 Firefox 75以降では、アドレスバーをクリックするなどしてURLやテキストを入力できる状態になると、... 続きを読む

CSSの便利なセレクタ「:placeholder-shown疑似クラス」を使うと、フローティングラベルも簡単に実装できる | コリス

2018/06/19 164 users 範疇 セレクタ アニメーション コリス 実装

フローティングラベルとは、フォームのラベルが入力時にアニメーションで上方向にフローティングするテクニックです。 一昔前までは、完全にJavaScriptの範疇、もしくは強引なCSSでもたつく感じのアニメーションでしか実装...記事の続きを読む 続きを読む

iPhoneのキーボード入力をカスタマイズしてちょいワザ覚えてしたら超快適になった - Engadget 日本版

2017/08/04 22 users iPhone 筆者 フリック入力 機種変 Android

筆者はAndroidからiPhoneへ乗り換えてもうすぐ3年。iPhone 6 iPhone 6s iPhone 7 Plusと機種変を重ねてきて使い込んできたつもりでずが、いまだに入力時にもたつくことがあります。フリック入力が完璧じゃないとか根本的な問題はあるにせよ、ちょいとキーボード入力周りを見直してみました。 すると、いろいろなことがわかってきて、かなり快適になったのです。なお、この記事はi... 続きを読む

今どきの入力フォームはこう書く！ HTMLコーダーが抑えるべきinputタグの書き方まとめ - ICS MEDIA

2016/03/10 117 users HTMLコーダー 今どき inputタグ Prev 低下

ICS MEDIA HTML5 2016/03/10 今どきの入力フォームはこう書く！ HTMLコーダーが抑えるべきinputタグの書き方まとめ « Prev 最適なキーボードを設定する デスクトップブラウザーだけでなく、スマートフォンでも多くのユーザーがフォームを利用しています。キーボードを適切に設定されていないと入力時にユーザーがストレスを感じてしまい、コンバージョン率の低下につながります。 ... 続きを読む

Google、モバイルアプリで場所や住所を素早く入力できるオートコンプリートウィジェットをリリース － Publickey

2016/01/05 27 users Publickey モバイルアプリケーション iOS 候補

Googleは、iOSやAndroidのモバイルアプリケーションで、場所や住所の入力を支援するオートコンプリート機能を備えたウィジェットをリリースしました。 アプリケーションにウィジェットを追加することで、場所や住所の入力時のオートコンプリート機能を簡単に組み込むことができます。下記の画面は、入力時にオートコンプリートウィジェットが候補を表示しているところです。 オートコンプリート機能は、Plac... 続きを読む

Kobito for Windows - ソフトウェア開発者のためのMarkdownによる情報記録・共有ソフト

2015/05/12 112 users Markdown プレビュー 特長 装飾 ソフトウェア

快適な書き心地Kobitoは、Markdownで情報を記録・共有することに特化したソフトウェアです。 文章の入力と装飾が文字入力で完結するため、文章を書くことに集中しやすいという特長があります。 入力時には入力内容がリアルタイムにプレビューされるので、Markdownに慣れていない方も安心してお使いいただけます。 テキストをきれいに表示Markdownで入力されたテキストは、プレビューに表示されて... 続きを読む

【iPhone,iPad】iOS 8で文字を入力時にプチフリーズ状態になったら試してみませんか？ | 酔いどれオヤジのブログwp

2014/11/26 12 users yoidoreo オヤジ ブログwp iPhone,iPad

まいど、酔いどれ( @yoidoreo )です。 スポンサーリンク 文字入力時のフリーズ 『【iPhone,iPad】本日の「iOS 8.1.1」ソフトウェアアップデートでユーザ辞書が復活、登録も出来るようになった』でユーザ辞書が復活したのですが、iOS 7の時もそうだったのですが、文字入力時にプチフリーズ状態になってしまってます 試してみませんか？ 「iCloud Drive」を切ればユーザ辞書... 続きを読む

Excel 2013でドロップダウンリストを使って入力の手間を軽減する - 週アスPLUS

2014/08/10 13 users 週アスPLUS 手間 ドロップダウンリスト 置換 入力

今回は、一覧表の入力時に入力ミスなどを防げる“ドロップダウンリスト”の活用法について紹介しましょう。合わせて、入力データのメンテナンスに役立つ検索と置換についても紹介します。 ■一覧表を使いやすく整備する 住所録などの一覧表のデータ入力がひととおり完了したら、そのデータをより使いやすくするために、工夫しておくといいでしょう。たとえば、以前の記事で紹介したような詳細情報の表示画面では、キーボードから... 続きを読む

約1600万人のメタボ健診データを生かせず　入力時に全角/半角が混在し、突合不能に：日経コンピュータDigital

2014/02/14 162 users 日経コンピュータDigital 半角 全角 NDB レセプト

厚生労働省が研究目的で構築した「ナショナルデータベース（NDB）」で、約1600万人分のメタボ健診のデータが、レセプトのデータとひも付けできないことが判明。 当初想定した医療費削減のための研究に、十分に生かせない状況に陥っている。理由はデータ入力時に「全角」と「半角」が混在していたことだ。 厚労省は2014年3月までにシステム改修を含めた改善策をまとめる。 続きを読む

[JS]パスワード入力時・入力後に一時的にパスワードを可視化するスクリプト -hideShowPassword | コリス

2013/06/20 58 users コリス hide jQuery スクリプト 不可視

フォームのパスワードは通常伏せ字になっており見ることができませんが、入力後や入力時に一時的にパスワードを可視化するjQueryのプラグインを紹介します。 下記は入力後にパスワードを可視化したものですが、入力時に可視化した後に不可視にもできます。 Hide/Show Passwords Hide/Show Passwords -GitHub Hide/Show Passwordsのデモ Hide/S... 続きを読む

Firefox でいらなくなった入力候補を消す方法 | P O P * P O P

2007/02/23 192 users Firefox P O 入力候補 Apprentice 方法

Firefoxでいらなくなった入力候補を消す方法 February 23, 2007 10:29 AM written by 100SHIKI Apprentice ご存知の方も多いかもしれませんが、自分は知らなかったのでご紹介。ちょっと便利なFirefoxのTipsです。 FirefoxではURLの入力時に自動で候補を教えてくれます。いわゆる「自動入力補完」機能ですね。しかし、過去に間違ったUR... 続きを読む