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

No:37725

Spidr the spider Vs Exploding chicken
Developer User17114｜Date and time 24/1/21 14:19:01
Build time 14.081 sec｜Game capacity 5.63KB｜

Script

Sure! Here's a simple implementation of a game called "Spidr the Spider vs Exploding Chicken" using JavaScript and HTML:

Spidr the Spider vs Exploding Chicken

Instructions:

Use left and right arrow keys to move the spider and catch the exploding chickens!

To use this game, create an HTML file and save the provided code in it. Make sure to include the required image files (`emozi_all/game.png`, `emozi_all/chicken.png`, `emozi_rabbit.png`) in the same directory as the HTML file. Then, you can open the HTML file on any browser (including a smartphone browser) to play the game. Use the left and right arrow keys to move the spider and try to catch the exploding chickens. The game ends when a chicken reaches the bottom of the game board, and your score is displayed in an alert dialog.

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

Sure! Here's a simple implementation of a game called "Spidr the Spider vs Exploding Chicken" using JavaScript and HTML:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Spidr the Spider vs Exploding Chicken</title>
    <style>
        body {
            text-align: center;
        }
        #gameBoard {
            width: 300px;
            height: 400px;
            border: 2px solid black;
            margin: 20px auto;
            position: relative;
        }
        #spidr {
            position: absolute;
            left: 50%;
            bottom: 0;
            transform: translateX(-50%);
            width: 50px;
            height: 50px;
        }
        .chicken {
            position: absolute;
            width: 50px;
            height: 50px;
        }
        .explosion {
            position: absolute;
            width: 100px;
            height: 100px;
            z-index: 999;
        }
    </style>
</head>
<body>
    <h1>Spidr the Spider vs Exploding Chicken</h1>
    <h2>Instructions:</h2>
    <p>Use left and right arrow keys to move the spider and catch the exploding chickens!</p>
    
    <div id="gameBoard">
        <img id="spidr" src="spidr.png" alt="Spidr the Spider">
    </div>

// Game variables
        let score = 0;
        let gameOver = false;

// Add event listeners for arrow key controls
        document.addEventListener('keydown', moveSpidr);

// Function to move the spider
        function moveSpidr(event) {
            if (!gameOver) {
                if (event.key === "ArrowLeft" && parseInt(spidr.style.left) > 0) {
                    spidr.style.left = parseInt(spidr.style.left) - 10 + 'px';
                }
                else if (event.key === "ArrowRight" && parseInt(spidr.style.left) < gameBoard.clientWidth - spidr.clientWidth) {
                    spidr.style.left = parseInt(spidr.style.left) + 10 + 'px';
                }
            }
        }

// Function to create a new exploding chicken
        function createChicken() {
            if (!gameOver) {
                const chicken = document.createElement('img');
                chicken.src = 'chicken.png';
                chicken.alt = 'Exploding Chicken';
                chicken.classList.add('chicken');
                chicken.style.top = '0';
                chicken.style.left = Math.random() * (gameBoard.clientWidth - chicken.clientWidth) + 'px';
                gameBoard.appendChild(chicken);

// Move the chicken downwards
                const chickenMove = setInterval(() => {
                    if (!gameOver) {
                        const chickenTop = parseInt(chicken.style.top);
                        chicken.style.top = (chickenTop + 10) + 'px';

// Check if the chicken has collided with the spider
                        if (checkCollision(chicken)) {
                            explodeChicken(chicken);
                            clearInterval(chickenMove);
                        }

// Check if the chicken has reached the bottom of the game board
                        if (chickenTop > gameBoard.clientHeight - chicken.clientHeight) {
                            gameBoard.removeChild(chicken);
                            clearInterval(chickenMove);
                            endGame();
                        }
                    }
                }, 50);
            }
        }

// Function to check if the spider and chicken have collided
        function checkCollision(chicken) {
            const spiderRect = spidr.getBoundingClientRect();
            const chickenRect = chicken.getBoundingClientRect();

return !(
                spiderRect.top > chickenRect.bottom ||
                spiderRect.right < chickenRect.left ||
                spiderRect.bottom < chickenRect.top ||
                spiderRect.left > chickenRect.right
            );
        }

// Function to explode the chicken and increase the score
        function explodeChicken(chicken) {
            const explosion = document.createElement('img');
            explosion.src = 'explosion.png';
            explosion.alt = 'Explosion';
            explosion.classList.add('explosion');
            explosion.style.left = chicken.style.left;
            explosion.style.top = chicken.style.top;
            gameBoard.appendChild(explosion);

gameBoard.removeChild(chicken);

setTimeout(() => {
                gameBoard.removeChild(explosion);
            }, 1000);

score++;
        }

// Function to end the game
        function endGame() {
            gameOver = true;
            alert('Game Over! Your score: ' + score);
            location.reload();
        }

// Start the game by creating a chicken every second
        setInterval(createChicken, 1000);
    </script>
</body>
</html>
```

To use this game, create an HTML file and save the provided code in it. Make sure to include the required image files (`spidr.png`, `chicken.png`, `explosion.png`) in the same directory as the HTML file. Then, you can open the HTML file on any browser (including a smartphone browser) to play the game. Use the left and right arrow keys to move the spider and try to catch the exploding chickens. The game ends when a chicken reaches the bottom of the game board, and your score is displayed in an alert dialog.