電話によるお問い合わせ

営業時間 9:00~18:00 土日祝休み

電話をかける

感動!HTML5で作られたスーパーマリオ!完全リメイク!HTML5を駆使した無料ゲームまとめ

#WEB知識おもしろ

HTML5で作られたスーパーマリオブラザースのサイトを発見しました。
ブラウザーはChromeのみのです。

Full Screen Mario -GitHub

他のブラウザーで開くとSorry, this needs Chrome!と出ます。
私の小学生時代はスーパーマリオにあけくれた毎日でした。
このサイトとにかく再現率がやばい!!ワクワクしちゃいますね!

操作はキーボードで行うようです。

■移動
左右の矢印キー or AとD
■ジャンプ
上の矢印キー or W or スペース
■ファイア
Shift
■ポーズ
P
■ミュート
M

仕事中にはやってはだめですよ(笑)
こっそりやりたいときは音を消してミュートで!

ステージも選べるという優れもの。スーパーマリオ好きにはたまりませんね~。
それもこれがHTML5で作られているってどんな仕組みなんだろう。。。

他HTML5で作られたゲームサイトも紹介します。

グラディウス



ステージ1のみですが、アーケード版を完全移植!

移動 : 矢印キー
ショット : Z
ミサイル : X
パワーアップ : C

HTML5であそんでみたクエスト



ドラゴンクエスト風ゲーム。通常のゲームと違って、ローカルの画像をブラウザに直接ドラッグ&ドロップして戦います。

画像がJPEGなら「たたかう」、GIFなら「まほう」、PNGなら「かいふく」といった具合に、ドロップした画像の拡張子によってコマンドが変化。


すっごいですね!ドラクエも好きだった私には感動です。

パックマン



なつかしい!パックマン。とてもスムーズに動きます、操作性抜群です!
※Firefox推奨

テトリス



誰もが一度は遊んだことがあるであろうタイトル!

←、→で移動
↑で回転
↓で落とします

本当にWEBはどんどん進化していますね。HTML5の勉強をするのにソースを見るのもいいですね!

この記事を書いた人

WEBクリエイター

サイバー編集部

岐阜でWEB集客に強いホームページ制作・リニューアルならサイバーインテリジェンスへ!

Share

その他のおすすめ記事

AIの一種であるAGI(汎用人工知能)とは?|強いAIと弱いAI

AIの上位互換AGI(汎用人工知能)とは?|強いAIと弱いAI

スタッフブログ

無料で使える写真やイラストをダウンロードできるサイト

デザイン

Wi-fiの「5G」とは違う?!5G(第5世代通信)とは?

スタッフブログ