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

No:12527

101

←

Prev Next

→

Grimace’s Birthday
Developer User4714｜Date and time 23/8/19 6:53:12
Build time 16.732 sec｜Game capacity 3.922KB｜

Script

Sure! Here's an example of an HTML file that creates a simple game to celebrate Grimace's Birthday using JavaScript. It uses pictograms for better visualization and can be played on a smartphone.

Grimace's Birthday Game

Help Grimace collect his birthday presents!

This HTML file implements a simple game where the player controls Grimace (represented by a square) using touch gestures on a smartphone. The objective is to collect the birthday presents (represented by another square) falling from the top of the screen. The player can move Grimace horizontally or vertically based on their swipe gesture. The score is displayed on the top left corner of the screen. By opening this HTML file in a web browser on a smartphone, the game will start automatically, and the player can control Grimace to collect the falling presents and increase their score.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's an example of an HTML file that creates a simple game to celebrate Grimace's Birthday using JavaScript. It uses pictograms for better visualization and can be played on a smartphone.

```html
<!DOCTYPE html>
<html>
<head>
    <title>Grimace's Birthday Game</title>
    <style>
        body {
            text-align: center;
            font-family: Arial, sans-serif;
        }
    </style>
</head>
<body>
    <h1>Grimace's Birthday Game</h1>
    <h2>Help Grimace collect his birthday presents!</h2>

// Initialize game variables
        let playerX = canvas.width / 2;
        let playerY = canvas.height - 50;
        let presentX = Math.random() * (canvas.width - 50);
        let presentY = 0;
        let score = 0;

// Handle touch events for mobile operation
        canvas.addEventListener("touchstart", handleTouchStart, false);
        canvas.addEventListener("touchmove", handleTouchMove, false);

let touchStartX = 0;
        let touchStartY = 0;
        let touchEndX = 0;
        let touchEndY = 0;

function handleTouchStart(event) {
            touchStartX = event.touches[0].clientX;
            touchStartY = event.touches[0].clientY;
        }

function handleTouchMove(event) {
            touchEndX = event.touches[0].clientX;
            touchEndY = event.touches[0].clientY;
        }

// Update game state
        function update() {
            if (touchEndX !== 0 && touchEndY !== 0) {
                // Calculate the movement direction based on swipe gesture
                const dx = touchEndX - touchStartX;
                const dy = touchEndY - touchStartY;

// Adjust player position based on swipe direction
                if (Math.abs(dx) >= Math.abs(dy)) {
                    playerX += dx > 0 ? 10 : -10;
                } else {
                    playerY += dy > 0 ? 10 : -10;
                }

touchStartX = touchEndX;
                touchStartY = touchEndY;
                touchEndX = 0;
                touchEndY = 0;
            }

// Check if player collected the present
            if (playerX < presentX + 50 && playerX + 50 > presentX && playerY < presentY + 50 && playerY + 50 > presentY) {
                presentX = Math.random() * (canvas.width - 50);
                presentY = 0;
                score++;
            }

// Move the present down
            presentY += 5;

// Clear the canvas
            ctx.clearRect(0, 0, canvas.width, canvas.height);

// Draw the player
            ctx.fillStyle = "#FFC300";
            ctx.fillRect(playerX, playerY, 50, 50);

// Draw the present
            ctx.fillStyle = "#FF5733";
            ctx.fillRect(presentX, presentY, 50, 50);

// Display the score
            ctx.fillStyle = "#000000";
            ctx.font = "20px Arial";
            ctx.fillText("Score: " + score, 10, 30);

requestAnimationFrame(update);
        }

// Start the game
        update();
    </script>
</body>
</html>
```

By opening this HTML file in a web browser on a smartphone, the game will start automatically, and the player can control Grimace to collect the falling presents and increase their score.