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

No:50835

←

Prev Next

→

City building game
Developer User20725｜Date and time 24/3/9 23:46:47
Build time 10.696 sec｜Game capacity 1.562KB｜

Script

City Building Game

Click on a building to place it in the city

🏠

🏥

🏫

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>City Building Game</title>
<style>
    body {
        font-family: Arial, sans-serif;
        text-align: center;
    }
    #city {
        width: 300px;
        height: 300px;
        border: 1px solid #000;
        margin: 0 auto;
    }
    .building {
        display: inline-block;
        width: 50px;
        height: 50px;
        background-color: #333;
        margin: 10px;
        cursor: pointer;
    }
</style>
</head>
<body>
    <h1>City Building Game</h1>
    <p>Click on a building to place it in the city</p>
    <div id="city"></div>
    <div class="building" id="house">🏠</div>
    <div class="building" id="hospital">🏥</div>
    <div class="building" id="school">🏫</div>

buildings.forEach(building => {
            building.addEventListener('click', () => {
                const newBuilding = document.createElement('div');
                newBuilding.innerText = building.innerText;
                newBuilding.style.width = '50px';
                newBuilding.style.height = '50px';
                newBuilding.style.background = '#333';
                newBuilding.style.margin = '10px';
                city.appendChild(newBuilding);
            });
        });
    </script>
</body>
</html>