メモ帳がない時に、とりあえず、ブラウザのアドレスバーにdata:text/html, <body contenteditable>って打ち込めばメモ帳がわりになるのか！！その発想はなかった
タグ検索の該当結果が少ないため、タイトル検索結果を表示しています。
渋川よしき on Twitter: "メモ帳がない時に、とりあえず、ブラウザのアドレスバーにdata:text/html, <body contenteditable>って打ち込めばメモ帳がわりになるのか！！その発想はなかった"
メモ帳がない時に、とりあえず、ブラウザのアドレスバーにdata:text/html, <body contenteditable>って打ち込めばメモ帳がわりになるのか！！その発想はなかった
Web フォントを使って contenteditable から脱出する - LINE ENGINEERING
LINE株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。 LINEヤフー Tech Blog こんにちは、LINE フロントエンド開発センターの玉田です。突然ですが、本日よりフロントエンド開発に携わる UIT のエンジニアが持ち回りで記事を公開する「UIT 新春 Tech blog」を開催します。 UIT のメンバーが普段の業務で得た知識や、年末年始でたまった知見などを共有していきます。本記事の公開から 1 月 28 日 (金) まで、平日の毎日違うメンバーが記事を公開していきます。ぜひ最後まで見に来てください！ トップバッターは私から、フロントエンドエンジニアを悩ませる contenteditable からの脱却についてです。 contenteditable の呪い みなさんは contenteditable につい
lotz on Twitter: "騙されたと思ってブラウザのURLバーに data:text/html,<html contenteditable> って打ってEnter押してみて タブがメモ帳になって超便利だから"
騙されたと思ってブラウザのURLバーに data:text/html,<html contenteditable> って打ってEnter押してみて タブがメモ帳になって超便利だから
いまさらだけどContentEditableをいじって、キャレットの扱いがしんどいということがわかったよ - 算譜王におれはなる!!!!
WYSIWYGエディタに憧れてContentEditableをいじってみると、けっこうな底無し沼だと。気づいたときにはどっぷり浸かってるやつ。 ググればそれなりに知見が見つかるし、良い感じのライブラリもある。けど僕がやりたかったことは、自分でコードを書いて実現するのが早いんじゃないかなーと思って、沼にダイブした。 やりたいことは、ワープロソフトみたいなやつというよりも、編集しているテキストのスタイルがリアルタイムに変化するMarkdownエディタっぽいやつ。 つまりユーザがスタイルを当てるんじゃなくて、ユーザが入力したテキストに応じてスタイルを当てたい。 より正確には、テキストの見た目をおしゃれにするだけではなくて、もっと高度な何か、Reactのコンポーネントとか、を埋め込むとかしたかった。 Draft.jsやEditor.jsのような、ContentEditableを扱いやすくしてくれる
LINE株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。 LINEヤフー Tech Blog こんにちは、LINE フロントエンド開発センターの玉田です。突然ですが、本日よりフロントエンド開発に携わる UIT のエンジニアが持ち回りで記事を公開する「UIT 新春 Tech blog」を開催します。 UIT のメンバーが普段の業務で得た知識や、年末年始でたまった知見などを共有していきます。本記事の公開から 1 月 28 日 (金) まで、平日の毎日違うメンバーが記事を公開していきます。ぜひ最後まで見に来てください！ トップバッターは私から、フロントエンドエンジニアを悩ませる contenteditable からの脱却についてです。 contenteditable の呪い みなさんは contenteditable につい
ブラウザで動くエディタを開発していると避けては通れない contenteditable な caret の位置（座標）。いろいろなアプローチがありますが、一部のケース（縦書き）でうまく動かないことがあったので回避策をメモしておきます。 ダミーの DOM を挿入する わりと古典的でよく使われている方法です。caret のある位置にダミーの DOM を挿入して getBoundingClientRect で位置を取得するというもの。どんな場面でもほぼ確実に caret の位置が取得できます。ただ、大きな弱点があり DOM を挿入するので対象 DOM の TextNode が分割されてしまいます。contenteditable を使ってゴリゴリ開発をする場合、むやみに Node が変わるとつらすぎるので、あまり使うメリットはありません。 <p contenteditable="true">cli
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
![エリートの、エリートによる、エリートのための“反民主主義”――とその解毒薬 | p2ptk[.]org](https://cdn-ak-scissors.b.st-hatena.com/image/square/a6372461faa955f5542d8de3768208198e687392/height=288;version=1;width=512/https%3A%2F%2Fp2ptk.org%2Fwp-content%2Fuploads%2F2024%2F05%2Fscientific-deliberation.jpg)
Web フォントを使って contenteditable から脱出する
ContentEditable な caret の位置（座標）を取得する - Qiita
yukari3.nm.bex.jp
news.denfaminicogamer.jp
cycles.wiki.fc2.com
note.com/coalg
www.makuake.com
www.asahi.com