どや!?高度なHTML5のデモ

25 10月

  • このエントリーをはてなブックマークに追加

高度なHTML5のデモ

高度なHTML5のデモをご紹介。
ゲームもあり、操作するのが楽しいですよ!
 

1.Tunneler

画面をクリックまたはドラッグすることで、カラフルな曲線が出てきます。

高度なHTML5のデモ:Tunneler

2.JuicyDrop

HTML5のミュージックプレイヤー。スクリーンの音楽想像がすごい。

高度なHTML5のデモ:JuicyDrop

3.Magnetic

磁気をHTML5で表現したもの。
操作方法は、ドラッグで磁石を移動、ダブルクリックで磁石を追加、キーボードの「←/→」で磁石の表示非表示設定。

高度なHTML5のデモ:Magnetic

4.Trail

カラフルな線がカーソルに付いてきます。カーソルが止まると、その周りをぐるぐる回ります。
クリックすると、半径若干大きくなります。

高度なHTML5のデモ:Trail

5.Sinuous

なつかしい、精子ゲーム的なものです。ランキングも出て、地味に面白い!

【操作方法】
①赤い玉を避けてください
②緑の玉に触れると不死身になります
③不死身になって、赤い玉を破壊してください
④多く動かすことによってスコアが上がります
⑤長い時間生き残ってください

高度なHTML5のデモ:Sinuous

6.DDD

マウスで動かしたぶんだけ線が出現します。それがウネウネ動く不思議なデモ。

高度なHTML5のデモ:DDD

7.Harmony

ブラウザ上でお絵かきができます。

【操作方法】
①ドラッグすることで、自由に絵を書くことができます
②上部のバーが操作パネルで、線の色や形状、保存/クリアなど選ぶことができます。

高度なHTML5のデモ:Harmony

8.Lines go all over the place.

マウスで動かしたぶんだけカラフルな線が出現します。

高度なHTML5のデモ:Lines go all over the place.

9.Chrome Canopy

木が育っていく映像を操作パネルで動かしたり色を変えたりしていくデモ。

高度なHTML5のデモ:Chrome Canopy

10.Ball Pool

ボールのプールです。ボールが跳ねたり、出現したりいろいろ。

【操作方法】
①ボールをドラッグ&ドロップで移動
②背景をドラッグするとボールが出現
③ダブルクリックでやり直し

高度なHTML5のデモ:Ball Pool
 
 
色々なことができるんですね~。
まだまだ、楽しそうなものがありますよ!
続きはこちらへ! → 50 Advanced HTML5 Demos to show It’s Power

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です


*

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <img localsrc="" alt="">

トラックバックURL

この記事のトラックバック URL