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

No:44707

101

←

Prev Next

→

Teacher game
Developer User19444｜Date and time 24/2/19 0:56:51
Build time 6.681 sec｜Game capacity 2.204KB｜

Script

Teacher Game

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Teacher Game</title>
<style>
    body {
        font-family: Arial, sans-serif;
        text-align: center;
    }
    canvas {
        border: 1px solid black;
        margin: 20px auto;
    }
</style>
</head>
<body>
<h1>Teacher Game</h1>
<canvas id="gameCanvas" width="400" height="400"></canvas>

const player = {
        x: 200,
        y: 200,
        size: 50,
        speed: 5
    };

const teacher = {
        x: Math.random() * 350,
        y: Math.random() * 350,
        size: 50
    };

function drawPlayer() {
        ctx.fillStyle = "blue";
        ctx.fillRect(player.x, player.y, player.size, player.size);
    }

function drawTeacher() {
        ctx.fillStyle = "red";
        ctx.fillRect(teacher.x, teacher.y, teacher.size, teacher.size);
    }

function checkCollision() {
        if (player.x < teacher.x + teacher.size &&
            player.x + player.size > teacher.x &&
            player.y < teacher.y + teacher.size &&
            player.y + player.size > teacher.y) {
            alert("Congratulations! You caught the teacher.");
            teacher.x = Math.random() * 350;
            teacher.y = Math.random() * 350;
        }
    }

function update() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        drawPlayer();
        drawTeacher();
        checkCollision();
    }

function movePlayer(event) {
        switch (event.key) {
            case "ArrowUp":
                player.y -= player.speed;
                break;
            case "ArrowDown":
                player.y += player.speed;
                break;
            case "ArrowLeft":
                player.x -= player.speed;
                break;
            case "ArrowRight":
                player.x += player.speed;
                break;
        }
    }

document.addEventListener("keydown", movePlayer);

setInterval(update, 1000 / 60); // 60 frames per second
</script>
</body>
</html>
```