Hang in there, Goemon.'s game

Click here for free DL of the app version that can save data.

No:9262

338

←

Prev Next

→

Hang in there, Goemon.
Developer User4246｜Date and time 23/7/23 2:33:35
Build time 19.298 sec｜Game capacity 1.721KB｜

Script

了解です！ゴエモンのゲームを作ってみましょう。以下に、1枚のHTMLファイルに含まれるJavaScriptコードを示します。

⚔️

このコードでは、ウェブページ上に400x400の枠線が描かれたゲームコンテナが表示されます。ゴエモンの剣の絵文字が初期状態で表示され、キーボードの矢印キーの操作に応じて剣の向きが変わります。このファイルをHTML形式で保存し、ウェブブラウザで開いてください。ゲームコンテナが表示され、矢印キーを押すと剣の向きが変化する様子が確認できると思います。

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

Click here for free DL of the app version that can save data.

了解です！ゴエモンのゲームを作ってみましょう。以下に、1枚のHTMLファイルに含まれるJavaScriptコードを示します。

```html
<!DOCTYPE html>
<html>
  <head>
    <title>がんばれゴエモン</title>
    <style>
      #game-container {
        width: 400px;
        height: 400px;
        background-color: #ddd;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 48px;
      }
    </style>
  </head>
  <body>
    <div id="game-container">
      ⚔️
    </div>

function moveCharacter(event) {
        switch (event.key) {
          case "ArrowUp":
            gameContainer.innerHTML = "⚔️👆";
            break;
          case "ArrowDown":
            gameContainer.innerHTML = "⚔️👇";
            break;
          case "ArrowLeft":
            gameContainer.innerHTML = "⚔️👈";
            break;
          case "ArrowRight":
            gameContainer.innerHTML = "⚔️👉";
            break;
        }
      }

document.addEventListener("keydown", moveCharacter);
    </script>
  </body>
</html>
```

このコードでは、ウェブページ上に400x400の枠線が描かれたゲームコンテナが表示されます。ゴエモンの剣の絵文字が初期状態で表示され、キーボードの矢印キーの操作に応じて剣の向きが変わります。

このファイルをHTML形式で保存し、ウェブブラウザで開いてください。ゲームコンテナが表示され、矢印キーを押すと剣の向きが変化する様子が確認できると思います。