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

No:27498

183

←

Prev Next

→

Make a game that you are a mouse and you got 10 li..ALL
Developer User12467｜Date and time 23/12/7 9:55:03
Build time 49.382 sec｜Game capacity 2.96KB｜

Script

Sure! Here's an implementation of the game using JavaScript and pictograms. Save the code below into a single HTML file and open it in a web browser:

Mouse Escape Game

Please make sure to have "emozi_all/mouse.png" and "emozi_all/cat.png" images in the same directory as the HTML file. Adjust the width and height values in the CSS styles to fit the pictograms appropriately.

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

Sure! Here's an implementation of the game using JavaScript and pictograms. Save the code below into a single HTML file and open it in a web browser:

```html
<!DOCTYPE html>
<html>
  <head>
    <style>
      #game {
        position: relative;
        width: 500px;
        height: 500px;
        border: 1px solid black;
        background-image: url('mouse.png');
        background-repeat: no-repeat;
        background-position: center center;
      }
      
      #cat {
        position: absolute;
        width: 100px;
        height: 100px;
        background-image: url('cat.png');
        background-repeat: no-repeat;
        background-position: center center;
      }
    </style>
  </head>
  <body>
    <h1>Mouse Escape Game</h1>
    <button onclick="setDifficulty('easy')">Easy</button>
    <button onclick="setDifficulty('kindaHard')">Kinda Hard</button>
    <button onclick="setDifficulty('veryHard')">Very Hard</button>
    <div id="game"></div>
    <script>
      var lives = 10;
      var gameSpeed = 0;
      var mousePosition = { x: 0, y: 0 };
      var catPosition = { x: 0, y: 0 };
      var gameInterval;
      
      function setDifficulty(difficulty) {
        if (difficulty === 'easy') {
          gameSpeed = 1;
        } else if (difficulty === 'kindaHard') {
          gameSpeed = 2;
        } else if (difficulty === 'veryHard') {
          gameSpeed = 3;
        }
        
        clearInterval(gameInterval);
        gameInterval = setInterval(gameLoop, 1000 / (20 * gameSpeed));
      }
      
      function gameLoop() {
        updateMousePosition();
        updateCatPosition();
        checkCollision();
        displayGame();
      }
      
      function updateMousePosition() {
        var x = Math.floor(Math.random() * 401);
        var y = Math.floor(Math.random() * 401);
        mousePosition = { x: x, y: y };
      }
      
      function updateCatPosition() {
        var x = Math.floor(Math.random() * 401);
        var y = Math.floor(Math.random() * 401);
        catPosition = { x: x, y: y };
      }
      
      function checkCollision() {
        if (Math.abs(mousePosition.x - catPosition.x) < 50 && Math.abs(mousePosition.y - catPosition.y) < 50) {
          lives--;
          if (lives === 0) {
            clearInterval(gameInterval);
            alert('Game Over');
          }
        }
      }
      
      function displayGame() {
        var gameElement = document.getElementById('game');
        gameElement.style.backgroundPosition = mousePosition.x + 'px ' + mousePosition.y + 'px';
        
        var catElement = document.getElementById('cat');
        catElement.style.left = catPosition.x + 'px';
        catElement.style.top = catPosition.y + 'px';
      }
    </script>
  </body>
</html>
```

Please make sure to have "mouse.png" and "cat.png" images in the same directory as the HTML file. Adjust the width and height values in the CSS styles to fit the pictograms appropriately.