Man with a dune buggy and a AK-47 orange fading background grey grass and bloody zombies's game

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

No:30001

←

Prev Next

→

Man with a dune buggy and a AK-47 orange fading ba..ALL
Developer User14684｜Date and time 23/12/20 5:11:53
Build time 16.761 sec｜Game capacity 4.233KB｜

Script

Sure! Here's a simple game that meets your requirements. In this game, you control a man with a dune buggy and an AK-47. The background is orange fading to grey, and there is bloody grass and zombies. To keep it simple, the game will be a basic shooting game where you have to shoot the zombies. Here's the code:

Make sure to save the images (`emozi_all/zombie.png` and `emozi_cat.png`) in the same directory as the HTML file for them to be displayed properly. You can replace these images with appropriate pictograms if you have them. To play the game, you can use the left and right arrow keys to move the player, and click anywhere on the game canvas to shoot bullets. The goal is to shoot the zombies as they appear and earn points. The game will keep running until you close the browser tab. Please note that this is a very basic implementation and can be enhanced further with additional features, levels, sound effects, and more.

←

Prev　Next

→ 　

Back　

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

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

To keep it simple, the game will be a basic shooting game where you have to shoot the zombies. Here's the code:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Zombie Shooting Game</title>
  <style>
    body {
      background-color: #FFA500;
    }
    
    #gameCanvas {
      background-color: #808080;
      width: 400px;
      height: 300px;
      margin: 0 auto;
    }
    
    #zombie {
      position: absolute;
      width: 50px;
      height: 50px;
      background-image: url(zombie.png);
      background-size: cover;
    }
    
    #player {
      position: absolute;
      width: 50px;
      height: 50px;
      background-image: url(dunebuggy.png);
      background-size: cover;
    }
    
    #bullet {
      position: absolute;
      width: 10px;
      height: 10px;
      background-color: red;
    }
  </style>
</head>
<body>
  <div id="gameCanvas">
    <div id="zombie"></div>
    <div id="player"></div>
    <div id="bullet"></div>
  </div>

function startGame() {
      player = {
        x: 175,
        y: 220,
        width: 50,
        height: 50
      };
      
      bullet = {
        x: player.x + player.width / 2 - 5,
        y: player.y,
        width: 10,
        height: 10,
        speed: -5,
        active: false
      };

zombie = {
        x: 50,
        y: 50,
        width: 50,
        height: 50,
        speed: 2
      };
      
      score = 0;
      
      document.addEventListener('keydown', movePlayer);
      document.addEventListener('mousedown', fireBullet);

updateGame();
    }

function updateGame() {
      var gameCanvas = document.getElementById('gameCanvas');

gameCanvas.innerHTML = '';

moveBullet();
      moveZombie();

if (collisionDetection()) {
        score++;
      }

gameCanvas.innerHTML += '<div id="zombie" style="top:' + zombie.y + 'px; left:' + zombie.x + 'px;"></div>';
      gameCanvas.innerHTML += '<div id="player" style="top:' + player.y + 'px; left:' + player.x + 'px;"></div>';
      gameCanvas.innerHTML += '<div id="bullet" style="top:' + bullet.y + 'px; left:' + bullet.x + 'px;"></div>';

requestAnimationFrame(updateGame);
    }

function movePlayer(event) {
      if (event.keyCode === 37 && player.x > 0) { // Left arrow key
        player.x -= 10;
      } else if (event.keyCode === 39 && player.x < 350) { // Right arrow key
        player.x += 10;
      }
    }

function fireBullet() {
      if (!bullet.active) {
        bullet.active = true;
        bullet.x = player.x + player.width / 2 - 5;
        bullet.y = player.y;
      }
    }

function moveBullet() {
      if (bullet.active) {
        bullet.y += bullet.speed;
      
        if (bullet.y < 0) {
          bullet.active = false;
        }
      }
    }

function moveZombie() {
      zombie.y += zombie.speed;

if (zombie.y > 280) {
        zombie.y = 50;
        zombie.x = Math.floor(Math.random() * (350 - 50)) + 50;
      }
    }

function collisionDetection() {
      if (bullet.y <= zombie.y + zombie.height &&
          bullet.y + bullet.height >= zombie.y &&
          bullet.x <= zombie.x + zombie.width &&
          bullet.x + bullet.width >= zombie.x) {
        bullet.active = false;
        return true;
      }
      
      return false;
    }

startGame();
  </script>
</body>
</html>
```

Make sure to save the images (`zombie.png` and `dunebuggy.png`) in the same directory as the HTML file for them to be displayed properly. You can replace these images with appropriate pictograms if you have them.

To play the game, you can use the left and right arrow keys to move the player, and click anywhere on the game canvas to shoot bullets. The goal is to shoot the zombies as they appear and earn points. The game will keep running until you close the browser tab.

Please note that this is a very basic implementation and can be enhanced further with additional features, levels, sound effects, and more.