A ball jump over all the big and small wall and make Highest score's game

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

No:16368

128

←

Prev Next

→

A ball jump over all the big and small wall and ma..ALL
Developer User7256｜Date and time 23/9/17 17:06:53
Build time 29.539 sec｜Game capacity 3.457KB｜

Script

Sure! Here's an example of a simple game where a ball jumps over walls to achieve the highest score. The game is implemented as a single HTML file, with JavaScript enclosed in script tags.

In this game, the ball jumps when the player touches/clicks on the game container. Walls are generated at random intervals, and the player needs to jump over them. Each time the ball successfully passes a wall without colliding, the score increases. The game ends if the ball collides with any wall, and the final score is shown in an alert dialog. Note: This is a basic implementation to demonstrate the game mechanics. You can enhance it further by adding additional features like levels, power-ups, animations, sound effects, etc.

←

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 game where a ball jumps over walls to achieve the highest score. The game is implemented as a single HTML file, with JavaScript enclosed in script tags.

```html
<!DOCTYPE html>
<html>
<head>
  <title>Jumping Ball Game</title>
  <style>
    #game-container {
      position: relative;
      width: 300px;
      height: 400px;
      border: 1px solid #000;
      margin: 0 auto;
      overflow: hidden;
    }

#ball {
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      bottom: 0;
      width: 30px;
      height: 30px;
      background-color: red;
      border-radius: 50%;
    }

.wall {
      position: absolute;
      bottom: 0;
      width: 60px;
      height: 120px;
      background-color: blue;
    }
  </style>
</head>
<body>
  <div id="game-container">
    <div id="ball"></div>
  </div>

// Function to generate walls at random intervals
    function generateWall() {
      const wall = document.createElement("div");
      wall.classList.add("wall");

const randomPosition = Math.floor(Math.random() * (gameContainer.offsetWidth - 60));
      wall.style.left = randomPosition + "px";
      gameContainer.appendChild(wall);

// Move the wall upwards and update the score
      const intervalId = setInterval(() => {
        wall.style.bottom = parseInt(wall.style.bottom) + 5 + "px";

// Check collision with the ball
        if (isCollision(wall, ball)) {
          clearInterval(intervalId);
          endGame();
        }

// Check if wall is off the screen
        if (parseInt(wall.style.bottom) > gameContainer.offsetHeight) {
          clearInterval(intervalId);
          gameContainer.removeChild(wall);
          incrementScore();
        }
      }, 10);
    }

// Function to increment score
    function incrementScore() {
      score++;
      console.log("Score: " + score);
    }

// Function to check collision between two elements
    function isCollision(element1, element2) {
      const rect1 = element1.getBoundingClientRect();
      const rect2 = element2.getBoundingClientRect();

return (
        rect1.left < rect2.right &&
        rect1.right > rect2.left &&
        rect1.top < rect2.bottom &&
        rect1.bottom > rect2.top
      );
    }

// Handle ball jump on touch/click
    gameContainer.addEventListener("touchstart", jumpBall);
    gameContainer.addEventListener("mousedown", jumpBall);

function jumpBall() {
      ball.style.bottom = parseInt(ball.style.bottom) + 60 + "px";
    }

// Function to end the game
    function endGame() {
      alert("Game Over! Final Score: " + score);
    }

// Start generating walls
    setInterval(generateWall, 2000);
  </script>
</body>
</html>
```

Note: This is a basic implementation to demonstrate the game mechanics. You can enhance it further by adding additional features like levels, power-ups, animations, sound effects, etc.