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

No:27858

←

Prev Next

→

Ninja game
Developer User13779｜Date and time 23/12/9 19:42:55
Build time 31.596 sec｜Game capacity 4.049KB｜

Script

Sure! Here's a simple ninja game implementation using JavaScript:

Ninja Game

To use this code, save it in an HTML file, and make sure to put an image file called "emozi_all/ninja.png" in the same directory as the HTML file. When opened in a web browser (preferably on a smartphone), it will display the game board with a ninja at the bottom. The player can click anywhere on the game board to start the game and move the ninja using touch (hover) controls. The objective is to avoid colliding with the falling obstacles as the score increases. When a collision occurs, an alert will appear showing the player's final score. Note: This is a simplified implementation and can be expanded upon for more complex gameplay and features.

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

Sure! Here's a simple ninja game implementation using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Ninja Game</title>
  <style>
    body {
      background-color: #f0f0f0;
      text-align: center;
    }
    
    #game-board {
      width: 500px;
      height: 300px;
      margin: 0 auto;
      border: 5px solid #000;
      position: relative;
    }
    
    #ninja {
      position: absolute;
      bottom: 0;
      width: 50px;
      height: 50px;
      background-image: url('ninja.png');
      background-size: cover;
    }
  </style>
</head>
<body>
  <h1>Ninja Game</h1>
  <div id="game-board">
    <div id="ninja"></div>
  </div>
  
  <script>
    // Global Variables
    var ninja = document.getElementById("ninja");
    var gameBoard = document.getElementById("game-board");
    var gameStarted = false;
    var score = 0;
    
    // Event Listeners
    gameBoard.addEventListener("click", startGame);
    gameBoard.addEventListener("mouseover", moveNinja);
    
    // Functions
    function startGame() {
      if (!gameStarted) {
        // Reset game state
        gameStarted = true;
        score = 0;
        updateScore();
        
        // Reset ninja position
        ninja.style.bottom = "0";
        
        // Start game loop
        gameLoop();
      }
    }
    
    function moveNinja(event) {
      var rect = gameBoard.getBoundingClientRect();
      var mouseX = event.clientX - rect.left;
      
      // Move ninja only within game board
      if (mouseX >= 0 && mouseX <= gameBoard.offsetWidth - ninja.offsetWidth) {
        ninja.style.left = mouseX + "px";
      }
    }
    
    function gameLoop() {
      if (gameStarted) {
        moveObstacle();
        if (isCollision()) {
          endGame();
        } else {
          requestAnimationFrame(gameLoop);
        }
      }
    }
    
    function moveObstacle() {
      var obstacle = document.createElement("div");
      obstacle.classList.add("obstacle");
      
      obstacle.style.left = getRandomPosition() + "px";
      
      gameBoard.appendChild(obstacle);
      
      var distanceToBottom = gameBoard.offsetHeight;
      var obstacleInterval = setInterval(function() {
        distanceToBottom -= 10;
        obstacle.style.top = distanceToBottom + "px";
        
        if (distanceToBottom < 0) {
          clearInterval(obstacleInterval);
          gameBoard.removeChild(obstacle);
          score++;
          updateScore();
        }
      }, 50);
    }
    
    function isCollision() {
      var obstacles = document.querySelectorAll(".obstacle");
      var ninjaRect = ninja.getBoundingClientRect();
      
      for (var i = 0; i < obstacles.length; i++) {
        var obstacleRect = obstacles[i].getBoundingClientRect();
        
        if (ninjaRect.left < obstacleRect.right &&
            ninjaRect.right > obstacleRect.left &&
            ninjaRect.top < obstacleRect.bottom &&
            ninjaRect.bottom > obstacleRect.top) {
          return true;
        }
      }
      
      return false;
    }
    
    function updateScore() {
      document.getElementById("score").textContent = "Score: " + score;
    }
    
    function endGame() {
      gameStarted = false;
      alert("Game Over! Your score: " + score);
    }
    
    function getRandomPosition() {
      return Math.floor(Math.random() * gameBoard.offsetWidth);
    }
  </script>
</body>
</html>
```

To use this code, save it in an HTML file, and make sure to put an image file called "ninja.png" in the same directory as the HTML file. When opened in a web browser (preferably on a smartphone), it will display the game board with a ninja at the bottom. The player can click anywhere on the game board to start the game and move the ninja using touch (hover) controls. The objective is to avoid colliding with the falling obstacles as the score increases. When a collision occurs, an alert will appear showing the player's final score.

Note: This is a simplified implementation and can be expanded upon for more complex gameplay and features.