Doggy run, controls: easy has cats, hard has 🚘 🌋 🔪 🧁, sandbox is creating your own game's game

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

No:23461

←

Prev Next

→

Doggy run, controls: easy has cats, hard has 🚘 🌋 🔪..ALL
Developer User6472｜Date and time 23/10/31 6:14:32
Build time 80.498 sec｜Game capacity 3.943KB｜

Script

Sure! Here's a simple game called "Doggy Run" implemented as a single HTML file with JavaScript code enclosed in script tags:

This game, "Doggy Run", is a simple browser game where the objective is to control the dog using the arrow keys and avoid colliding with the falling cats. The player earns points for each cat that passes through the screen without collision. If the dog collides with a cat, the game ends and the player's score is displayed. You can run this game on your smartphone or any modern web browser by saving the code as an HTML file and opening it. The game canvas is displayed with a brown dog at the bottom, which can be moved left or right using the arrow keys. Cats continuously fall from the top, and the player needs to avoid collision as much as possible to earn points. Feel free to modify the pictograms, controls, or any other aspect of the game to suit your preferences. Enjoy playing "Doggy Run" or create your own game in the provided sandbox!

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's a simple game called "Doggy Run" implemented as a single HTML file with JavaScript code enclosed in script tags:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Doggy Run</title>
  <style>
    #gameCanvas {
      border: 1px solid black;
      background-color: lightgray;
      height: 400px;
      width: 400px;
      position: relative;
    }
    
    #dog {
      position: absolute;
      bottom: 0;
      left: 50%;
      transform: translateX(-50%);
      height: 50px;
      width: 50px;
      background-color: brown;
      border-radius: 50%;
    }
    
    .cat {
      position: absolute;
      bottom: 0;
      height: 30px;
      width: 30px;
      background-color: gray;
      border-radius: 50%;
    }
  </style>
</head>
<body>
  <div id="gameCanvas">
    <div id="dog"></div>
  </div>
  <script>
    // Game variables
    var gameCanvas = document.getElementById("gameCanvas");
    var dog = document.getElementById("dog");
    var score = 0;
    var speed = 5;
    var cats = [];
    var gameOver = false;
    
    // Create a new cat in random position
    function createCat() {
      var cat = document.createElement("div");
      cat.className = "cat";
      cat.style.left = Math.floor(Math.random() * (gameCanvas.offsetWidth - 30)) + "px";
      gameCanvas.appendChild(cat);
      return cat;
    }
    
    // Move the dog left or right
    function moveDog(event) {
      if (event.key === "ArrowLeft" && dog.offsetLeft > 0) {
        dog.style.left = (dog.offsetLeft - 20) + "px";
      } else if (event.key === "ArrowRight" && dog.offsetLeft < (gameCanvas.offsetWidth - 50)) {
        dog.style.left = (dog.offsetLeft + 20) + "px";
      }
    }
    
    // Check for collision between dog and cats
    function checkCollision() {
      var dogRect = dog.getBoundingClientRect();
      for (var i = 0; i < cats.length; i++) {
        var catRect = cats[i].getBoundingClientRect();
        if (
          dogRect.bottom > catRect.top &&
          dogRect.top < catRect.bottom &&
          dogRect.right > catRect.left &&
          dogRect.left < catRect.right
        ) {
          gameOver = true;
          alert("Game Over! Your score: " + score);
          break;
        }
      }
    }
    
    // Move the cats down and remove them if they go out of the screen
    function moveCats() {
      for (var i = 0; i < cats.length; i++) {
        var cat = cats[i];
        cat.style.bottom = (cat.offsetTop + speed) + "px";
        if (cat.offsetTop > gameCanvas.offsetHeight) {
          cat.remove();
          cats.splice(i, 1);
          score++;
        }
      }
    }
    
    // Game loop
    function gameLoop() {
      if (!gameOver) {
        if (Math.random() > 0.9) {
          cats.push(createCat());
        }
        moveCats();
        checkCollision();
        requestAnimationFrame(gameLoop);
      }
    }
    
    // Start the game when the page is loaded
    window.addEventListener("DOMContentLoaded", function() {
      window.addEventListener("keydown", moveDog);
      gameLoop();
    });
  </script>
</body>
</html>
```

You can run this game on your smartphone or any modern web browser by saving the code as an HTML file and opening it. The game canvas is displayed with a brown dog at the bottom, which can be moved left or right using the arrow keys. Cats continuously fall from the top, and the player needs to avoid collision as much as possible to earn points.

Feel free to modify the pictograms, controls, or any other aspect of the game to suit your preferences. Enjoy playing "Doggy Run" or create your own game in the provided sandbox!