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

No:8211

1780

←

Prev Next

→

Creat a spider girl game
Developer User4158｜Date and time 23/7/14 8:39:31
Build time 22.774 sec｜Game capacity 3.369KB｜

Script

Sure! Here's a playable sample game that simulates a simple spider girl game using JavaScript. Please note that the game has been scaled down for simplicity.

Spider Girl Game

In this game, you control a spider girl (`blue` square) using the arrow keys on your smartphone. The objective is to catch the spiders (`red` circles) while avoiding colliding with the borders of the game window. Your score increases by 1 each time you catch a spider. The game will continuously update and display your score in the top left corner of the canvas. Please copy the above code into a single HTML file and open it in a web browser to play the game.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋グッズランキング

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

Sure! Here's a playable sample game that simulates a simple spider girl game using JavaScript. Please note that the game has been scaled down for simplicity.

```html
<!DOCTYPE html>
<html>
<head>
    <title>Spider Girl Game</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
        }
        #canvas {
            border: 1px solid #000;
        }
    </style>
</head>
<body>
    <h1>Spider Girl Game</h1>
    <canvas id="canvas" width="600" height="400"></canvas>
    
    <script>
        const canvas = document.getElementById("canvas");
        const ctx = canvas.getContext("2d");

const player = {
            x: canvas.width / 2,
            y: canvas.height / 2,
            size: 50,
            speed: 5
        };

const spider = {
            x: Math.random() * canvas.width,
            y: Math.random() * canvas.height,
            size: 30
        };

let score = 0;

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

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

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

function update() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            
            drawPlayer();
            drawSpider();
            drawScore();
            
            if (player.x - player.size / 2 < spider.x + spider.size &&
                player.x + player.size / 2 > spider.x - spider.size &&
                player.y - player.size / 2 < spider.y + spider.size &&
                player.y + player.size / 2 > spider.y - spider.size) {
                spider.x = Math.random() * canvas.width;
                spider.y = Math.random() * canvas.height;
                score++;
            }

requestAnimationFrame(update);
        }

function movePlayer(e) {
            switch (e.keyCode) {
                case 37: // left arrow key
                    player.x -= player.speed;
                    break;
                case 39: // right arrow key
                    player.x += player.speed;
                    break;
                case 38: // up arrow key
                    player.y -= player.speed;
                    break;
                case 40: // down arrow key
                    player.y += player.speed;
                    break;
            }
        }

document.addEventListener("keydown", movePlayer);

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

Please copy the above code into a single HTML file and open it in a web browser to play the game.