I want to create a jumping game's game

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

No:37051

←

Prev Next

→

I want to create a jumping game
Developer User16972｜Date and time 24/1/20 1:34:52
Build time 10.436 sec｜Game capacity 2.395KB｜

Script

Sure! Here's an example of a simple jumping game implemented as a single HTML file using JavaScript. You can run it in any web browser, including on a smartphone. It uses pictograms for visual representation.

To play the game, simply tap (or click) anywhere on the screen to make the player jump. The player (represented by a square) will jump upwards and come back down, landing on the platform (also represented by a square) at the bottom. The game loop continuously updates the player's position and checks for collisions with the platform.

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

```html
<!DOCTYPE html>
<html>
  <head>
    <title>Jumping Game</title>
    <style>
      canvas {
        border: 1px solid #000;
      }
    </style>
  </head>
  <body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>

// Event listeners for jump control
      document.addEventListener("mousedown", function (event) {
        if (!isJumping) {
          isJumping = true;
          player.dy = -player.jumpForce;
        }
      });

// Game loop function
      function gameLoop() {
        // Update
        if (isJumping) {
          player.y += player.dy;
          player.dy += player.gravity;

// Check for collision with platform
          if (player.y + player.size > platform.y) {
            isJumping = false;
            player.dy = 0;
            player.y = platform.y - player.size;
          }
        }

// Draw
        context.clearRect(0, 0, canvas.width, canvas.height);

context.fillStyle = "#000"; // Color for player and platform
        context.fillRect(player.x, player.y, player.size, player.size);
        context.fillRect(
          platform.x,
          platform.y,
          platform.width,
          platform.height
        );

// Request animation frame
        requestAnimationFrame(gameLoop);
      }

// Start the game
      gameLoop();
    </script>
  </body>
</html>
```