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

No:14984

A game where a cat has to dodge tables chairs and ..ALL
Developer User6472｜Date and time 23/9/5 18:24:53
Build time 34.789 sec｜Game capacity 3.654KB｜

Script

Here's a simple implementation of the game you described using HTML, JavaScript, and pictograms for smartphone operation. Please note that the game logic is intentionally kept basic for demonstration purposes:

Cat Dodger Game

Save the above code in an HTML file (e.g., `cat_dodger_game.html`). Ensure you have pictogram images for the cat, table, chair, and dog, and update their filenames in the CSS. Place the HTML file and the pictogram images in the same folder, then you can open the HTML file in your smartphone's browser to play the game. When the cat collides with an obstacle, an alert will show the game score, and the game will restart. Use the "Up" and "Down" buttons to control the cat's movement.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Cat Dodger Game</title>
  <style>
    body {
      text-align: center;
      padding-top: 100px;
      font-family: Arial, sans-serif;
    }
    .game-board {
      display: inline-block;
      position: relative;
      width: 200px;
      height: 300px;
      border: 1px solid #000;
    }
    .cat, .table, .chair, .dog {
      position: absolute;
      width: 50px;
      height: 50px;
    }
    .cat {
      background-image: url('cat.png');
      background-size: cover;
    }
    .table {
      background-image: url('table.png');
      background-size: cover;
    }
    .chair {
      background-image: url('chair.png');
      background-size: cover;
    }
    .dog {
      background-image: url('dog.png');
      background-size: cover;
    }
  </style>
</head>
<body>
  <h1>Cat Dodger Game</h1>
  <div class="game-board">
    <div class="cat"></div>
    <div class="obstacle"></div>
  </div>
  <button id="upBtn">Up</button>
  <button id="downBtn">Down</button>

// Function to move the obstacle randomly and check for collisions
      const moveObstacle = () => {
        const randomPosition = obstaclePositions[Math.floor(Math.random() * obstaclePositions.length)];
        obstacle.className = randomPosition;
        
        // Check for collision
        const catTop = parseInt(window.getComputedStyle(cat).getPropertyValue("top"));
        const obstacleTop = parseInt(window.getComputedStyle(obstacle).getPropertyValue("top"));
        const obstacleLeft = parseInt(window.getComputedStyle(obstacle).getPropertyValue("left"));

// If collision occurs
        if (catTop === obstacleTop && obstacleLeft <= 55 && obstacleLeft >= 5) {
          alert("Game Over! Your score: " + score);
          score = 0;
        } else {
          score++;
          moveObstacle();
        }
      }

// Function to move the cat up
      const moveUp = () => {
        const catTop = parseInt(window.getComputedStyle(cat).getPropertyValue("top"));
        if (catTop !== 0) {
          cat.style.top = (catTop - 50) + 'px';
        }
      }

// Function to move the cat down
      const moveDown = () => {
        const catTop = parseInt(window.getComputedStyle(cat).getPropertyValue("top"));
        if (catTop !== 250) {
          cat.style.top = (catTop + 50) + 'px';
        }
      }

// Initialize game
      moveObstacle();

// Button event listeners
      upBtn.addEventListener("click", moveUp);
      downBtn.addEventListener("click", moveDown);
    });
  </script>
</body>
</html>
```