Create a platforming game that ups the score by 1 every time you touch a new platform's game

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

No:33382

←

Prev Next

→

Create a platforming game that ups the score by 1 ..ALL
Developer User15755｜Date and time 24/1/4 0:35:49
Build time 24.154 sec｜Game capacity 2.799KB｜

Script

Sure! Here's an example of a platforming game implemented as a single HTML file with JavaScript. It uses pictograms to represent the platforms and updates the score by 1 every time the player touches a new platform:

Score: 0

In this game, the player (represented by a red square) can move by touching and dragging on the screen of a smartphone. The objective is to touch new platforms (represented by blue rectangles) to increase the score. The score is displayed at the top right corner of the screen. As the player moves upward, touching higher platforms, the score increases by 1 for each new platform touched.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>

<head>
  <style>
    body {
      margin: 0;
      padding: 0;
    }
    
    #player {
      position: absolute;
      width: 50px;
      height: 50px;
      background-color: red;
    }
    
    .platform {
      position: absolute;
      width: 100px;
      height: 20px;
      background-color: blue;
    }
    
    #score {
      position: fixed;
      top: 10px;
      right: 10px;
      font-size: 24px;
      color: white;
    }
  </style>
</head>

<body>
  <div id="player"></div>
  <div id="score">Score: 0</div>

function createPlatform(x, y) {
      var platform = document.createElement("div");
      platform.className = "platform";
      platform.style.left = x + "px";
      platform.style.top = y + "px";
      document.body.appendChild(platform);
    }

function updateScore() {
      score++;
      document.getElementById("score").innerHTML = "Score: " + score;
    }

function touchPlatform() {
      updateScore();
    }

function movePlayer(e) {
      if (e.touches) {
        var touch = e.touches[0];
        playerX = touch.clientX;
        playerY = touch.clientY;

// Check if player touches a new platform
        var platforms = document.getElementsByClassName("platform");
        for (var i = 0; i < platforms.length; i++) {
          var platform = platforms[i];
          var rect = platform.getBoundingClientRect();
          var platformX = rect.left;
          var platformY = rect.top;

if (
            playerX >= platformX &&
            playerX <= platformX + rect.width &&
            playerY >= platformY &&
            playerY <= platformY + rect.height &&
            platformY > lastPlatformY
          ) {
            touchPlatform();
            lastPlatformY = platformY;
            break;
          }
        }
      }
    }

function initGame() {
      createPlatform(50, 200);
      createPlatform(200, 300);
      createPlatform(100, 400);

document.addEventListener("touchmove", movePlayer);
    }

window.onload = initGame;
  </script>
</body>

</html>
```