hashrock https://blog.hatena.ne.jp/hashrock/ No Regrets in Bathing https://hashrock.hatenablog.com/ ふつーのドラッグ出来たりリサイズ出来たりする付箋。 SVGで作る必要があったのかは謎。 DEMO コードはこちら。 github.com ポイント SVGで複数行のテキストを表示するには、foreignObject + divを使うのが定番らしい。 ただしその場合、IE11は見捨てなければならない。 cacooなんかもIEは非対応にしている。 エディタに関してはSVG外でやっている。cacooをみると、absoluteでiframeとcontenteditableを乗っけている。 iframeを介す理由は謎だけど、IE対応のためかも？という話を教えてもらった 今回はプレーンテキストでいいので、… 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fhashrock.hatenablog.com%2Fentry%2F2017%2F11%2F20%2F012117" title="Vue.js + SVG練習8 : 付箋を作った＆vuexに入門した - No Regrets in Bathing" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> https://cdn-ak.f.st-hatena.com/images/fotolife/h/hashrock/20171120/20171120010012.gif Hatena Blog https://hatena.blog 2017-11-20 01:21:17 rich https://hashrock.hatenablog.com/entry/2017/11/20/012117 1.0 100%