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

No:42409

136

←

Prev Next

→

Groovy Kart Racing: Play The Game, Choose The Mode..ALL
Developer User13970｜Date and time 24/2/11 17:51:25
Build time 8.992 sec｜Game capacity 2.747KB｜

Script

Groovy Kart Racing

Choose the Mode

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
    <title>Groovy Kart Racing</title>
</head>
<body>
    <h1>Groovy Kart Racing</h1>

<div id="game_container">
        <button id="start_button" onclick="startRace()">Start Race!</button>
        
        <div id="mode_selection">
            <h2>Choose the Mode</h2>
            <button onclick="selectMode('normal')">Normal Mode</button>
            <button onclick="selectMode('clone')">Clone Mode</button>
        </div>
        
        <div id="race_track">
            <h2 id="race_mode"></h2>
            
            <div id="kart"></div>
            
            <div id="clones_container"></div>
        </div>
    </div>

#start_button,
        #mode_selection {
            margin: 20px;
        }

#race_track {
            height: 300px;
            width: 500px;
            background-color: lightblue;
            position: relative;
            margin: 0 auto;
        }

#kart, .clone {
            height: 50px;
            width: 50px;
            background-color: red;
            position: absolute;
        }

.clone {
            background-color: green;
        }
    </style>
    
    <script>
        var kartPosition = 0;
        var mode = "normal";
        
        function startRace() {
            document.getElementById("start_button").style.display = "none";
            document.getElementById("mode_selection").style.display = "none";
            document.getElementById("race_track").style.display = "block";
            document.getElementById("race_mode").innerText = mode === "normal" ? "Normal Mode: Play Fast & Race!" : "Clone Mode: Click Button To Transform Into Clones!";
            
            if(mode === "normal") {
                document.addEventListener("keydown", moveKart);
            }
        }
        
        function selectMode(selectedMode) {
            mode = selectedMode;
        }
        
        function moveKart(event) {
            var key = event.key;
            
            if(key === "ArrowRight") {
                kartPosition += 10;
                document.getElementById("kart").style.left = kartPosition + "px";
            }
        }
        
        function transformIntoClones() {
            var kart = document.getElementById("kart");
            for(var i = 0; i < 5; i++) {
                var clone = document.createElement("div");
                clone.className = "clone";
                clone.style.left = kartPosition + "px";
                document.getElementById("clones_container").appendChild(clone);
                kartPosition += 70;
            }
        }
    </script>
</body>
</html>