HTML5で描かれた「破れる布」

2013_04_06_22_02.jpg

Tear-able Cloth – lonely pixel

HTML5のCanvasとJavascriptだけで描かれた破ることができる布がすごいです。
HTML5とJavascriptだけででこんな表現までできてしまうのかと驚いてしまいます。

2013_04_06_21_46.jpg

なんの変哲もない方眼紙のように見えますが、この方眼紙の上でドラッグすると、、、

2013_04_06_21_47.jpg

2013_04_06_21_47.jpg

カーテンのように動きます。更に、激しくドラッグすると、、、

2013_04_06_21_48-2.jpg

破れた!!

2013_04_06_21_48.jpg

ボロボロのカーテンのようになってしまいました。こんなことがHTML5とJavascriptだけでできてしまうなんて。。

試してみたい方はこちらからどうぞ。

Tear-able Cloth – lonely pixel

ソースはこちらで公開されていました。

Tear-able Cloth – CodePen

Related Posts Plugin for WordPress, Blogger...