AI game creator

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

No:4464

720

←

Prev Next

→

Humble Turkish Ice
Developer User3589｜Date and time 23/6/28 1:46:53
Build time 35.434 sec｜Game capacity 3.785KB｜

Script

ご依頼ありがとうございます。以下は私が作成したシンプルなJavaScriptゲームの例です。

このゲームは、ブラウザ上で遊ぶことができます。操作は「左矢印キー」でパドルを左に移動させ、「右矢印キー」でパドルを右に移動させます。ボールを落とさずに、パドルでボールを跳ね返し、スコアを稼ぎます。時間制限はありませんが、ボールを落とすとゲームオーバーになります。このプログラムはJavaScriptで実装されており、HTMLのcanvas要素を使用しています。また、スマホでも遊べるようにしています。

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

ご依頼ありがとうございます。以下は私が作成したシンプルなJavaScriptゲームの例です。

```
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>JavaScript Game</title>
    <style>
      canvas {
        border: 1px solid black;
      }
    </style>
  </head>
  <body>
    <canvas id="canvas" width="300" height="300"></canvas>
    <script>
      const canvas = document.getElementById("canvas");
      const ctx = canvas.getContext("2d");

let score = 0;

const ball = {
        x: canvas.width / 2,
        y: canvas.height - 30,
        dx: 2,
        dy: -2,
        radius: 10
      };

const paddle = {
        x: (canvas.width - 75) / 2,
        y: canvas.height - 10,
        width: 75,
        height: 10,
        dx: 5
      };

function drawBall() {
        ctx.beginPath();
        ctx.arc(ball.x, ball.y, ball.radius, 0, Math.PI * 2);
        ctx.fillStyle = "red";
        ctx.fill();
        ctx.closePath();
      }

function drawPaddle() {
        ctx.beginPath();
        ctx.rect(paddle.x, paddle.y, paddle.width, paddle.height);
        ctx.fillStyle = "blue";
        ctx.fill();
        ctx.closePath();
      }

function drawScore() {
        ctx.font = "16px Arial";
        ctx.fillStyle = "black";
        ctx.fillText("Score: " + score, 10, 20);
      }

function movePaddle() {
        if (rightPressed && paddle.x < canvas.width - paddle.width) {
          paddle.x += paddle.dx;
        } else if (leftPressed && paddle.x > 0) {
          paddle.x -= paddle.dx;
        }
      }

function draw() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        drawBall();
        drawPaddle();
        drawScore();
        movePaddle();
        updateBall();
      }

let rightPressed = false;
      let leftPressed = false;

function keyDownHandler(e) {
        if (e.key === "Right" || e.key === "ArrowRight") {
          rightPressed = true;
        } else if (e.key === "Left" || e.key === "ArrowLeft") {
          leftPressed = true;
        }
      }

function keyUpHandler(e) {
        if (e.key === "Right" || e.key === "ArrowRight") {
          rightPressed = false;
        } else if (e.key === "Left" || e.key === "ArrowLeft") {
          leftPressed = false;
        }
      }

document.addEventListener("keydown", keyDownHandler, false);
      document.addEventListener("keyup", keyUpHandler, false);

const interval = setInterval(draw, 10);
    </script>
  </body>
</html>
```