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

No:37164

Groovy Party Kart Racing: Start The Game, Choose T..ALL
Developer User13970｜Date and time 24/1/20 14:40:18
Build time 11.415 sec｜Game capacity 3.57KB｜

Script

Groovy Party Kart Racing

Choose Your Character:

Choose Your Racecar:

Ready, Set, Go!

This is a single HTML file implementing the Groovy Party Kart Racing game. It includes JavaScript for game logic and is enclosed in script tags. The game allows you to choose a character and a racecar before starting the race. The race begins after a countdown from 3 to 1 and ends with "Go!" displayed on the screen. The actual racing logic can be implemented within the `startRace()` function. The game is designed for smartphone operation and uses pictograms for character and racecar selection.

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Groovy Party Kart Racing</title>
    <style>
        body {
            background-color: #000;
            color: #fff;
            text-align: center;
            font-family: Arial, sans-serif;
        }
        
        h1 {
            font-size: 30px;
            margin-top: 100px;
        }
        
        img {
            width: 100px;
            height: 100px;
            margin: 10px;
            cursor: pointer;
        }
        
        #carSelect {
            display: none;
        }
        
        #raceTrack {
            margin-top: 20px;
            display: none;
        }
        
        #startBtn {
            padding: 10px 30px;
            background-color: #39f;
            color: #fff;
            font-size: 20px;
            border: none;
            cursor: pointer;
        }
        
        #countdown {
            font-size: 60px;
            margin-top: 20px;
        }
    </style>
</head>

<body>
    <h1>Groovy Party Kart Racing</h1>
    
    <div id="characterSelect">
        <h2>Choose Your Character:</h2>
        <img src="character1.png" id="character1" onclick="selectCharacter(1)">
        <img src="character2.png" id="character2" onclick="selectCharacter(2)">
        <img src="character3.png" id="character3" onclick="selectCharacter(3)">
    </div>
    
    <div id="carSelect">
        <h2>Choose Your Racecar:</h2>
        <img src="car1.png" id="car1" onclick="selectCar(1)">
        <img src="car2.png" id="car2" onclick="selectCar(2)">
        <img src="car3.png" id="car3" onclick="selectCar(3)">
    </div>
    
    <div id="raceTrack">
        <h2>Ready, Set, Go!</h2>
        <button id="startBtn" onclick="startRace()">Start Racing</button>
        <h1 id="countdown"></h1>
    </div>
    
    <script>
        var selectedCharacter = 0;
        var selectedCar = 0;
        var countdownSec;

function selectCharacter(character) {
            selectedCharacter = character;
            document.getElementById("characterSelect").style.display = "none";
            document.getElementById("carSelect").style.display = "block";
        }

function selectCar(car) {
            selectedCar = car;
            document.getElementById("carSelect").style.display = "none";
            document.getElementById("raceTrack").style.display = "block";
        }