AI game creator

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

No:36233

117

←

Prev Next

→

Spongebob duck
Developer User16766｜Date and time 24/1/17 4:20:23
Build time 15.027 sec｜Game capacity 3.658KB｜

Script

Sure! Here's a simple game called "Spongebob Duck" implemented as a single HTML file using JavaScript. The game can be played on a smartphone and uses pictograms for the graphics. Just copy and paste the code into an HTML file and open it in a web browser to play:

To make this game work, you'll need to provide the actual image files for Spongebob and the duck as `emozi_all/game.png` and `emozi_all/duck.png`, respectively. You can resize the canvas and adjust the image dimensions according to your preference. Enjoy playing "Spongebob Duck"!

←

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">
    <title>Spongebob Duck</title>
    <style>
        canvas {
            display: block;
            border: 1px solid black;
            margin: 0 auto;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>

// Spongebob object
        const spongebob = {
            x: canvas.width / 2,
            y: canvas.height - 100,
            width: 60,
            height: 80,
            image: spongebobImg
        };
        
        // Duck object
        const duck = {
            x: 0,
            y: 0,
            width: 40,
            height: 40,
            image: duckImg
        };
        
        // Move Spongebob based on touch event
        canvas.addEventListener("touchmove", function(event) {
            event.preventDefault();
            if (gameStarted) {
                const touchX = event.touches[0].clientX - canvas.offsetLeft;
                if (touchX > 0 && touchX < canvas.width - spongebob.width) {
                    spongebob.x = touchX;
                }
            }
        });
        
        // Start the game on touch event
        canvas.addEventListener("touchstart", function() {
            if (!gameStarted) {
                gameStarted = true;
                spawnDuck();
            }
        });
        
        // Game loop
        function draw() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            
            // Draw Spongebob
            ctx.drawImage(spongebob.image, spongebob.x, spongebob.y, spongebob.width, spongebob.height);
            
            // Draw Duck
            ctx.drawImage(duck.image, duck.x, duck.y, duck.width, duck.height);
            
            // Collision detection
            if (spongebob.x < duck.x + duck.width &&
                spongebob.x + spongebob.width > duck.x &&
                spongebob.y < duck.y + duck.height &&
                spongebob.y + spongebob.height > duck.y) {
                score++;
                spawnDuck();
            }
            
            // Draw score
            ctx.fillStyle = "black";
            ctx.font = "24px Arial";
            ctx.fillText("Score: " + score, 10, 30);
            
            if (gameStarted) {
                requestAnimationFrame(draw);
            }
        }
        
        // Generate duck at random position
        function spawnDuck() {
            duck.x = Math.random() * (canvas.width - duck.width);
            duck.y = Math.random() * (canvas.height - duck.height);
        }

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

To make this game work, you'll need to provide the actual image files for Spongebob and the duck as `spongebob.png` and `duck.png`, respectively. You can resize the canvas and adjust the image dimensions according to your preference. Enjoy playing "Spongebob Duck"!