Flappy frog. This game is like Blackbird but the bird is 🐸's game

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

No:43724

141

←

Prev Next

→

Flappy frog. This game is like Blackbird but t..ALL
Developer User15380｜Date and time 24/2/16 12:28:50
Build time 12.15 sec｜Game capacity 3.962KB｜

Script

Sure! Here's an example of a Flappy Frog game implemented as a single HTML file using JavaScript and enclosed in script tags:

To use this code, save it in an HTML file (e.g., `flappy_frog.html`) and open the file in a web browser. The game is played by pressing the spacebar to make the frog jump and avoid collision with the pipes. The score is shown at the top right corner, and the game ends when the frog collides with a pipe or goes out of bounds.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's an example of a Flappy Frog game implemented as a single HTML file using JavaScript and enclosed in script tags:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Flappy Frog Game</title>
  <style>
    #game {
      position: relative;
      width: 320px;
      height: 480px;
      border: 1px solid #000;
      background: #9cd5f6;
      overflow: hidden;
      margin: 0 auto;
    }

#player {
      position: absolute;
      left: 50px;
      top: 200px;
      width: 50px;
      height: 50px;
      background: url(frog.png) center center no-repeat;
      background-size: contain;
    }

.pipe {
      position: absolute;
      width: 80px;
      height: 400px;
      background: #087e8b;
      border-radius: 20px;
    }

#score {
      position: absolute;
      top: 10px;
      right: 10px;
      font-size: 24px;
      color: #000;
    }
  </style>
</head>
<body>
  <div id="game">
    <div id="player"></div>
    <div id="score">0</div>
  </div>

function startGame() {
      player.style.top = "200px";
      score = 0;
      isGameOver = false;
      game.innerHTML = '';
      game.appendChild(player);
      game.appendChild(scoreDisplay);

generatePipes();
      movePlayer();
    }

function gameOver() {
      isGameOver = true;
      alert("Game over! Your score: " + score);
    }

function generatePipes() {
      let pipeGap = 200;
      let pipePosition = 400;
      const pipeHeight = 400;

setInterval(() => {
        if (isGameOver) return;

const pipeTop = document.createElement('div');
        const pipeBottom = document.createElement('div');
        pipeTop.className = 'pipe';
        pipeBottom.className = 'pipe';

pipeTop.style.height = Math.random() * pipeHeight + "px";
        pipeBottom.style.height = pipeHeight - pipeTop.offsetHeight - pipeGap + "px";

game.appendChild(pipeTop);
        game.appendChild(pipeBottom);

pipePosition -= 3;
        pipeTop.style.left = pipePosition + 'px';
        pipeBottom.style.left = pipePosition + 'px';

if (pipePosition === 200) {
          score += 1;
          scoreDisplay.textContent = score;
        }

if (pipePosition === 0) {
          gameOver();
        }

if (
          player.getBoundingClientRect().left < pipeTop.getBoundingClientRect().left + pipeTop.offsetWidth &&
          player.getBoundingClientRect().left + player.offsetWidth > pipeTop.getBoundingClientRect().left &&
          (player.getBoundingClientRect().top < pipeTop.getBoundingClientRect().bottom ||
            player.getBoundingClientRect().bottom > pipeBottom.getBoundingClientRect().top)
        ) {
          gameOver();
        }
      }, 20);
    }

function movePlayer() {
      let playerPosition = 200;
      let gravity = 2;

let timerId = setInterval(() => {
        if (isGameOver) {
          clearInterval(timerId);
          return;
        }

playerPosition -= gravity;
        player.style.top = playerPosition + 'px';

if (playerPosition <= 0) {
          gameOver();
        }

if (playerPosition >= game.offsetHeight - player.offsetHeight) {
          gameOver();
        }
      }, 20);

window.addEventListener('keydown', function(event) {
        if (event.code === "Space") {
          playerPosition += 40;
        }
      });
    }

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