Make a 2d platformer game with no end's game

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

No:35338

←

Prev Next

→

Make a 2d platformer game with no end
Developer User16517｜Date and time 24/1/14 4:49:43
Build time 11.215 sec｜Game capacity 3.392KB｜

Script

Sure! Here's an example of a simple 2D platformer game implemented as a single HTML file using JavaScript and enclosed in `` tags: <br><br> <br> <style> canvas { display: block; margin: 0 auto; background-color: #f1f1f1; } </style> <canvas id="gameCanvas" width="400" height="300"></canvas>

This simple game features a player controlled by arrow keys on a 2D platform. The goal is to navigate the player across the screen without falling off the platform or touching the ground. The game includes basic collision detection with the platform and ground, and gravity physics applied to the player's movement. Feel free to modify and enhance the game as per your requirements. Note that this is just a basic example to get you started with a 2D platformer game.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

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

Sure! Here's an example of a simple 2D platformer game implemented as a single HTML file using JavaScript and enclosed in `<script>` tags:

```html
<!DOCTYPE html>
<html>
<head>
  <title>2D Platformer Game</title>
  <style>
    canvas {
      display: block;
      margin: 0 auto;
      background-color: #f1f1f1;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="400" height="300"></canvas>

// Player properties
    const player = {
      x: 50,
      y: 200,
      width: 32,
      height: 32,
      xSpeed: 3,
      ySpeed: 0,
      jumping: false
    };

// Key state object for tracking player input
    const keys = {};

// Gravity constant
    const gravity = 0.2;

// Ground and platform positions
    const ground = canvas.height - player.height;
    const platform = { x: 100, y: 150, width: 100, height: 10 };

// Game loop
    function draw() {
      // Clear canvas
      ctx.clearRect(0, 0, canvas.width, canvas.height);

// Draw player
      ctx.fillStyle = "#FF0000";
      ctx.fillRect(player.x, player.y, player.width, player.height);

// Draw ground
      ctx.fillStyle = "#00FF00";
      ctx.fillRect(0, ground, canvas.width, canvas.height - ground);

// Draw platform
      ctx.fillStyle = "#0000FF";
      ctx.fillRect(platform.x, platform.y, platform.width, platform.height);

// Update player position
      player.y += player.ySpeed;
      player.ySpeed += gravity;

if (player.y > ground) {
        player.y = ground;
        player.ySpeed = 0;
        player.jumping = false;
      }

// Check collision with platform
      if (
        player.y + player.height >= platform.y &&
        player.y + player.height <= platform.y + player.ySpeed &&
        player.x + player.width >= platform.x &&
        player.x <= platform.x + platform.width
      ) {
        player.y = platform.y - player.height;
        player.ySpeed = 0;
        player.jumping = false;
      }

// Update player position based on input
      if (keys.ArrowUp && !player.jumping) {
        player.ySpeed -= 6;
        player.jumping = true;
      }
      if (keys.ArrowLeft) {
        player.x -= player.xSpeed;
      }
      if (keys.ArrowRight) {
        player.x += player.xSpeed;
      }

// Request next frame
      requestAnimationFrame(draw);
    }

// Key down event listener
    document.addEventListener("keydown", function(event) {
      keys[event.code] = true;
    });

// Key up event listener
    document.addEventListener("keyup", function(event) {
      keys[event.code] = false;
    });

// Start game loop
    draw();
  </script>
</body>
</html>
```

This simple game features a player controlled by arrow keys on a 2D platform. The goal is to navigate the player across the screen without falling off the platform or touching the ground. The game includes basic collision detection with the platform and ground, and gravity physics applied to the player's movement.

Feel free to modify and enhance the game as per your requirements. Note that this is just a basic example to get you started with a 2D platformer game.