Create a shooting game that is for PC and mobile's game

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

No:35875

←

Prev Next

→

Create a shooting game that is for PC and mobile
Developer User16671｜Date and time 24/1/15 19:00:34
Build time 21.813 sec｜Game capacity 4.526KB｜

Script

Sure! Here's an example of a shooting game implemented as a single HTML file with JavaScript, enclosed in script tags, and designed for both PC and mobile devices using pictograms. The game will be playable once the page is loaded:

This is a simple shooting game where you control a blue player object that can move left and right using either keyboard (left and right arrow keys) or touch input (left and right side of the screen). The objective is to shoot down red bullets that fall from the top of the screen. It uses HTML5 canvas and updates the game at 60 frames per second. Feel free to modify and enhance the code to add more features, levels, graphics, and animations as per your requirements. Enjoy!

←

Prev　Next

→ 　

Back　

[PR]現在の人気ゲームランキング

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Shooting Game</title>
  <style>
    canvas {
      border: 1px solid black;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="400" height="600"></canvas>

// Initialize the game
    function init() {
      canvas = document.getElementById("gameCanvas");
      context = canvas.getContext("2d");

playerX = canvas.width / 2;
      playerY = canvas.height - 50;
      playerSpeed = 5;

bullets = [];
      bulletSpeed = 10;

// Event listeners for PC controls
      document.addEventListener("keydown", handleKeyDown);
      document.addEventListener("keyup", handleKeyUp);

// Event listeners for mobile controls
      canvas.addEventListener("touchstart", handleTouchStart);
      canvas.addEventListener("touchend", handleTouchEnd);

// Start game loop
      setInterval(update, 16); // 60 FPS
    }

// Update game objects and render on screen
    function update() {
      movePlayer();
      moveBullets();
      drawGame();
    }

// Move the player based on keyboard or touch input
    function movePlayer() {
      // PC controls
      if (leftKeyPressed()) {
        playerX -= playerSpeed;
      }
      if (rightKeyPressed()) {
        playerX += playerSpeed;
      }

// Mobile controls
      if (leftTouchPressed()) {
        playerX -= playerSpeed;
      }
      if (rightTouchPressed()) {
        playerX += playerSpeed;
      }

// Keep player within the canvas bounds
      if (playerX < 0) {
        playerX = 0;
      }
      if (playerX > canvas.width) {
        playerX = canvas.width;
      }
    }

// Move the bullets and remove them if they go off-screen
    function moveBullets() {
      for (var i = bullets.length - 1; i >= 0; i--) {
        bullets[i].y -= bulletSpeed;
        if (bullets[i].y < 0) {
          bullets.splice(i, 1);
        }
      }
    }

// Draw the game objects on the canvas
    function drawGame() {
      context.clearRect(0, 0, canvas.width, canvas.height);

// Draw player
      context.beginPath();
      context.arc(playerX, playerY, 20, 0, Math.PI * 2);
      context.fillStyle = "blue";
      context.fill();
      context.closePath();

// Draw bullets
      for (var i = 0; i < bullets.length; i++) {
        context.beginPath();
        context.arc(bullets[i].x, bullets[i].y, 5, 0, Math.PI * 2);
        context.fillStyle = "red";
        context.fill();
        context.closePath();
      }
    }

// PC controls
    var leftKey = false;
    var rightKey = false;

function handleKeyDown(event) {
      if (event.keyCode === 37) {
        leftKey = true;
      }
      if (event.keyCode === 39) {
        rightKey = true;
      }
    }

function handleKeyUp(event) {
      if (event.keyCode === 37) {
        leftKey = false;
      }
      if (event.keyCode === 39) {
        rightKey = false;
      }
    }

function leftKeyPressed() {
      return leftKey;
    }

function rightKeyPressed() {
      return rightKey;
    }

// Mobile controls
    var leftTouch = false;
    var rightTouch = false;

function handleTouchEnd(event) {
      leftTouch = false;
      rightTouch = false;
    }

function leftTouchPressed() {
      return leftTouch;
    }

function rightTouchPressed() {
      return rightTouch;
    }

// Start the game
    window.onload = function() {
      init();
    };
  </script>
</body>
</html>
```

Feel free to modify and enhance the code to add more features, levels, graphics, and animations as per your requirements. Enjoy!