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

No:1545

1516

←

Prev Next

→

taiyaki ontouto (rock band played in Tohoku about ..ALL
Developer sayaensm｜Date and time 23/6/18 18:26:14
Build time 26.362 sec｜Game capacity 2.864KB｜

Script

たいやき音頭

たいやきが出てくるので、タップして取り除こう！

残り時間：30秒

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

<!DOCTYPE html>
<html>
<head>
	<title>たいやき音頭</title>
	<meta charset="UTF-8"/>
	<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
	<style>
		body {
			background-color: #F5DEB3;
            text-align: center;
            font-size: 1.5rem;
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
		}
		h1 {
			font-size: 3rem;
			color: #D2691E;
		}
        p {
            color: #8B4513;
        }
        button {
            margin-top: 1rem;
            background-color: #FFDAB9;
            border: none;
            border-radius: 0.5rem;
            padding: 0.5rem 1rem;
            font-size: 1.2rem;
            cursor: pointer;
        }
        #countdown {
            font-size: 2rem;
            color: #8B0000;
        }
        #gameboard {
            margin-top: 2rem;
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            align-items: center;
        }
        .taiyaki {
            width: 5rem;
            height: 5rem;
            margin: 0.5rem;
            cursor: pointer;
        }
	</style>
</head>
<body>
	<h1>たいやき音頭</h1>
    <p>たいやきが出てくるので、タップして取り除こう！</p>
    <p>残り時間：<span id="countdown">30</span>秒</p>
    <div id="gameboard"></div>
    <button onclick="startGame()">スタート</button>
	<script>
        const gameboard = document.getElementById("gameboard");
        const countdownEl = document.getElementById("countdown");
        let countdown = 30;
        let timer;

// ゲームの本体。ランダムにたいやきを生成。
        function generateTaiyaki() {
            gameboard.innerHTML = "";
            for (let i = 0; i < 9; i++) {
                const taiyaki = document.createElement("img");
                taiyaki.className = "taiyaki";
                taiyaki.src = "https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/240/apple/271/fish-cake-with-swirl_1f365.png";
                taiyaki.alt = "たいやき";
                taiyaki.addEventListener("click", function() {
                    this.remove();
                });
                gameboard.appendChild(taiyaki);
            }
        }

// ゲーム開始。カウントダウンタイマーを始め、たいやきを生成。
        function startGame() {
            countdown = 30;
            timer = setInterval(function() {
                countdown--;
                if (countdown === 0) {
                    clearInterval(timer);
                    alert("タイムアップ！");
                    gameboard.innerHTML = "";
                    return;
                }
                countdownEl.textContent = countdown;
            }, 1000);
            generateTaiyaki();
        }
	</script>
</body>
</html>