HTML5の機能で画像ファイルを埋め込みイメージタグに変換するサンプル

base64エンコードという処理をするとHTMLファイルに画像ファイルなどを埋め込むことが可能になります。
そのbase64エンコードをやってくれるwebサービスなどもありますが、ブラウザでHTML5の機能だけでやることも可能です。
その変換用サンプルを作成しました。

起動画面



変換したい画像ファイルを「右クリック」→「編集」で
（この記事で使用している画像ファイルはicooon-mono.comからダウンロードさせていただきました）



ペイントで開いたら



「Ctrl + A」で全体を選択した後「Ctrl + C」でコピーして



先ほどのHTA画面の編集エリアで「Ctrl + V」で貼りつけて



「view」ボタンを押せば埋め込みイメージタグの完成



以下が上記で作成した埋め込みイメージ




以下ソース