Your mom versus rat game's game

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

No:21950

←

Prev Next

→

Your mom versus rat game
Developer User8074｜Date and time 23/10/19 11:36:12
Build time 61.314 sec｜Game capacity 2.761KB｜

Script

Sure! Here's a simple game called "Mom vs Rat" implemented as a single HTML file:

In the above code, the game consists of a canvas element where the game events are rendered. The mom and rat pictograms are drawn using the `drawImage` method. Tapping on the rat moves the mom towards it, and the score increases whenever mom catches the rat. The game continuously updates and renders the game state using the `update` function and the `requestAnimationFrame` method. Please note that this code assumes you have "emozi_rabbit.png" and "emozi_all/rat.png" images in the same directory as the HTML file. You can replace them with your desired pictograms.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's a simple game called "Mom vs Rat" implemented as a single HTML file:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Mom vs Rat Game</title>
</head>
<body>
  <canvas id="gameCanvas" width="400" height="400"></canvas>
  <script>
    // Get a reference to the canvas element
    const canvas = document.getElementById("gameCanvas");
    const context = canvas.getContext("2d");

// Define game variables
    let momX = 200;
    let momY = 200;
    let ratX = 0;
    let ratY = 0;
    let score = 0;

// Add event listener for touch/click input
    canvas.addEventListener("touchstart", handleTouchStart, false);

// Function to handle touch/click input
    function handleTouchStart(event) {
      // Get the touch/click coordinates
      const touchX = event.touches[0].clientX - canvas.offsetLeft;
      const touchY = event.touches[0].clientY - canvas.offsetTop;

// Check if the touch/click was on the rat
      if (touchX >= ratX && touchX <= ratX + 50 && touchY >= ratY && touchY <= ratY + 50) {
        // Increment score and randomly reposition the rat
        score++;
        ratX = Math.floor(Math.random() * (canvas.width - 50));
        ratY = Math.floor(Math.random() * (canvas.height - 50));
      }
    }

// Function to update the game state
    function update() {
      // Clear the canvas
      context.clearRect(0, 0, canvas.width, canvas.height);

// Draw mom pictogram
      const momImage = new Image();
      momImage.src = "mom.png";
      context.drawImage(momImage, momX, momY, 50, 50);

// Draw rat pictogram
      const ratImage = new Image();
      ratImage.src = "rat.png";
      context.drawImage(ratImage, ratX, ratY, 50, 50);

// Draw score
      context.font = "20px Arial";
      context.fillText("Score: " + score, 10, 30);

// Move mom towards the rat
      if (momX < ratX) {
        momX += 1;
      } else if (momX > ratX) {
        momX -= 1;
      }
      if (momY < ratY) {
        momY += 1;
      } else if (momY > ratY) {
        momY -= 1;
      }

// Request next animation frame
      requestAnimationFrame(update);
    }

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

Please note that this code assumes you have "mom.png" and "rat.png" images in the same directory as the HTML file. You can replace them with your desired pictograms.