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

No:9704

203

←

Prev Next

→

triceratops (dinosaur)
Developer User3840｜Date and time 23/7/26 21:27:17
Build time 11.184 sec｜Game capacity 2.152KB｜

Script

了解しました。以下にトリケラトプスのゲームのHTMLファイルを実装したコードを記述します。

トリケラトプスゲーム

このゲームは、スマートフォンでプレイすることを前提としています。上下左右の矢印キーを押すことでトリケラトプスを操作できます。画像ファイル "emozi_himawari.png" が同じディレクトリに存在すると想定していますが、必要に応じて実際のパスに修正してください。

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

了解しました。以下にトリケラトプスのゲームのHTMLファイルを実装したコードを記述します。

```html
<!DOCTYPE html>
<html>
<head>
    <title>トリケラトプスゲーム</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
        }

canvas {
            border: 1px solid black;
        }
    </style>
</head>
<body>
    <h1>トリケラトプスゲーム</h1>
    <canvas id="gameCanvas" width="500" height="500"></canvas>
    
    <script>
        // ゲームの処理を記述する
        const canvas = document.getElementById("gameCanvas");
        const ctx = canvas.getContext("2d");

const dinoWidth = 80;
        const dinoHeight = 80;
        const dinoX = canvas.width / 2 - dinoWidth / 2;
        const dinoY = canvas.height - dinoHeight - 10;
        const dinoSpeed = 5;

let dinoImage = new Image();
        dinoImage.src = "dinosaur.png";

let dino = {
            x: dinoX,
            y: dinoY,
            width: dinoWidth,
            height: dinoHeight
        };

function drawDino() {
            ctx.drawImage(dinoImage, dino.x, dino.y, dino.width, dino.height);
        }

document.addEventListener("keydown", moveDino);

function moveDino(event) {
            if (event.key === "ArrowLeft" && dino.x > 0) {
                dino.x -= dinoSpeed;
            } else if (event.key === "ArrowRight" && dino.x < canvas.width - dino.width) {
                dino.x += dinoSpeed;
            }
        }

function draw() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);

drawDino();

requestAnimationFrame(draw);
        }

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

このゲームは、スマートフォンでプレイすることを前提としています。上下左右の矢印キーを押すことでトリケラトプスを操作できます。画像ファイル "dinosaur.png" が同じディレクトリに存在すると想定していますが、必要に応じて実際のパスに修正してください。