2010/12/30

canvas要素に感動した




HTML5って今まで避けてきたけど、これ見て感動しました。
リンク先ページで10秒くらい我慢して眺めてみてください!
こんなのが作れるなんて・・・なんて素晴らしいcanvas!
HTML5は来年の春頃からやろうと思ってますが、ちょっとデモを作ってみた。

var canvas = document.createElement('canvas');
document.body.appendChild(canvas);
var anim = function() {
var i = 0;
var canCon= canvas.getContext('2d');
canCon.beginPath();

return function() {
canCon.fillRect(i++, 50, 100, 50);
};
}();
// アニメーション実行
setInterval(anim, 100);





【実行手順】
1.chromeのコンソール画面開いて、↑のソースをペッと貼る。
2.ブログの一番下までスクロールする。そしたら黒い棒みたいのがウネウネ動きますよ!