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

No:14616

107

←

Prev Next

→

tag a game were theres runners and tagers the tage..ALL
Developer User6311｜Date and time 23/9/3 12:46:22
Build time 30.359 sec｜Game capacity 4.356KB｜

Script

Sure! Here's an implementation of the game you described using HTML and JavaScript:

Tag Game

1:00

To play the game, simply open the HTML file in a web browser on your smartphone. The game board will be displayed with blue runners and red tagers. The tagers have to touch the runners to turn them into tagers while the runners have to avoid the tagers. The game lasts for 1 minute, and after that, an alert will appear declaring the runners as the winners.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

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

Sure! Here's an implementation of the game you described using HTML and JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Tag Game</title>
    <style>
        #game-board {
            width: 100%;
            height: 400px;
            background-color: #F5F5F5;
            position: relative;
        }
        .runner {
            width: 50px;
            height: 50px;
            background-color: blue;
            position: absolute;
            border-radius: 50%;
        }
        .tager {
            width: 50px;
            height: 50px;
            background-color: red;
            position: absolute;
            border-radius: 50%;
        }
        #timer {
            position: absolute;
            top: 10px;
            right: 10px;
            font-size: 20px;
        }
    </style>
</head>
<body>
    <h1>Tag Game</h1>
    <div id="game-board"></div>
    <p id="timer">1:00</p>

// Initialize game
        function initializeGame() {
            createRunners();
            createTagers();
            startTimer();
            addEventListeners();
        }

// Create runners
        function createRunners() {
            for (var i = 0; i < 20; i++) {
                var runner = document.createElement("div");
                runner.classList.add("runner");
                runner.style.left = getRandomPosition() + "px";
                runner.style.top = getRandomPosition() + "px";
                document.getElementById("game-board").appendChild(runner);
                runners.push(runner);
            }
        }

// Create tagers
        function createTagers() {
            for (var i = 0; i < 20; i++) {
                var tager = document.createElement("div");
                tager.classList.add("tager");
                tager.style.left = getRandomPosition() + "px";
                tager.style.top = getRandomPosition() + "px";
                document.getElementById("game-board").appendChild(tager);
                tagers.push(tager);
            }
        }

// Get random position for runners and tagers
        function getRandomPosition() {
            return Math.floor(Math.random() * (gameBoardWidth - 50));
        }

// Start timer
        function startTimer() {
            interval = setInterval(updateTimer, 1000);
        }

// Update timer display
        function updateTimer() {
            var minutes = Math.floor(timerSeconds / 60);
            var seconds = timerSeconds % 60;
            document.getElementById("timer").innerText = minutes + ":" + (seconds < 10 ? "0" : "") + seconds;
            timerSeconds--;

if (timerSeconds < 0) {
                endGame();
            }
        }

// Add event listeners
        function addEventListeners() {
            for (var i = 0; i < runners.length; i++) {
                runners[i].addEventListener("click", switchRoles);
            }
        }

// Switch roles when clicked
        function switchRoles() {
            if (this.classList.contains("runner")) {
                this.style.backgroundColor = "red";
                this.classList.remove("runner");
                this.classList.add("tager");
            } else {
                this.style.backgroundColor = "blue";
                this.classList.remove("tager");
                this.classList.add("runner");
            }
        }

// End game
        function endGame() {
            clearInterval(interval);
            for (var i = 0; i < tagers.length; i++) {
                document.getElementById("game-board").removeChild(tagers[i]);
            }
            alert("Game Over! Runners Win!");
        }

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