コンソールに画像を無理やり表示させてみた
Chromeのコンソールで色付きで出力されているサイトを見かけた.
やってみたかったので,ちょっと調べたらCSSで色が変えられるらしい.
そこでふと,「画像のピクセル読んで表示できんじゃね?」って思い立ったので作ってみた.
追記:Chromeでしか動かない
追追記:先人がいた
自分のほうはconsoleっぽさ重視ってことでひとつ
このページに埋め込んでみたので,コンソールを開いてみてほしい.
(最新版のChromeだけ動作確認.)
追記:Chromeでしか動かない
使用する際,CrossDomain制約には気をつけなければならない.
画像は下のURLから拝借した.
追追追記:動画も対応してみた
// Youtube開いてコンソールで実行してみる setInterval(function(){console.drawImage($('video'), 50, false);}, 500);
これぞコンソール https://t.co/mtPeL7qVfx
— 3846masa (@3846masa) January 22, 2015