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

No:11210

149

←

Prev Next

→

Walpurgis circumnavigation
Developer User1006｜Date and time 23/8/8 14:23:07
Build time 21.709 sec｜Game capacity 2.428KB｜

Script

了解です。ワルプルギスの廻天というゲームを作成しました。以下が実装例です。

ワルプルギスの廻天

スコア: 0

このプログラムは、ワルプルギスの廻天というゲームを実装しています。ゲーム画面にはキャラクター🧙が表示され、スマートフォンの傾きに応じてキャラクターが動きます。また、ゲーム画面下部にはスコアが表示され、1秒ごとにスコアが更新されます。このHTMLファイルをブラウザで開くと、ワルプルギスの廻天というゲームが遊べます。スマートフォンの傾きに合わせてキャラクターを動かし、スコアを上げることを目指してください。

←

Prev　Next

→ 　

Back　

[PR]現在の本の売れ筋ランキング

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

了解です。ワルプルギスの廻天というゲームを作成しました。以下が実装例です。

```html
<!DOCTYPE html>
<html>
<head>
  <title>ワルプルギスの廻天</title>
</head>
<body>
  <h1>ワルプルギスの廻天</h1>
  <p id="score">スコア: 0</p>
  <div id="game-container" style="width: 100vw; height: 100vh;"></div>
  <script>
    // ゲームの設定
    const GAME_WIDTH = window.innerWidth;
    const GAME_HEIGHT = window.innerHeight;
    const GAME_SPEED = 5;

// スコアの初期値
    let score = 0;

// ゲームコンテナの設定
    const gameContainer = document.getElementById("game-container");
    gameContainer.style.position = "relative";

// スコア表示の設定
    const scoreDisplay = document.getElementById("score");

// キャラクターの設定
    const character = document.createElement("span");
    character.style.fontSize = "30px";
    character.style.position = "absolute";
    character.style.bottom = "10px";
    character.style.left = "10px";
    character.innerHTML = "🧙";

// キャラクターをゲームコンテナに追加
    gameContainer.appendChild(character);

// スマホ操作
    window.addEventListener("deviceorientation", handleDeviceOrientation, true);

function handleDeviceOrientation(event) {
      let x = event.beta;  // 前後の傾斜(縦方向)
      let y = event.gamma; // 左右の傾斜(横方向)

// キャラクターの位置を更新
      character.style.transform = `translate(${x * GAME_SPEED}px, ${y * GAME_SPEED}px)`;
    }

// スコアを更新
    function updateScore() {
      score++;
      scoreDisplay.textContent = `スコア: ${score}`;
    }

// 1秒ごとにスコアを更新
    setInterval(updateScore, 1000);
  </script>
</body>
</html>
```

このプログラムは、ワルプルギスの廻天というゲームを実装しています。ゲーム画面にはキャラクター🧙が表示され、スマートフォンの傾きに応じてキャラクターが動きます。また、ゲーム画面下部にはスコアが表示され、1秒ごとにスコアが更新されます。

このHTMLファイルをブラウザで開くと、ワルプルギスの廻天というゲームが遊べます。スマートフォンの傾きに合わせてキャラクターを動かし、スコアを上げることを目指してください。