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

No:10423

108

←

Prev Next

→

Make an idle click mining game with 10 clickers yo..ALL
Developer Micah｜Date and time 23/7/31 10:55:49
Build time 26.776 sec｜Game capacity 4.009KB｜

Script

Click Mining Game

Score: 0

Clicker Level 1: 10 points per click

In the code above, I have created an idle click mining game with a single HTML file containing JavaScript. The game allows you to click on a clicker to earn points, and you can use those points to buy mines. Each clicker level increases the points earned per click. The first clicker is free, and subsequent ones can be purchased in the shop. The cost of each mine increases with its level. The game is optimized for smartphone operation and uses pictograms to represent clickers and mines. To visualize this game, you would need to save the code as an HTML file and open it in a web browser. You need to have the pictogram images referenced in the `img` tags available in the same directory as the HTML file.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Click Mining Game</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
        }

#score {
            font-size: 24px;
            margin-bottom: 20px;
        }

#clicker {
            font-size: 18px;
            margin-bottom: 10px;
        }

#shop {
            margin-top: 20px;
        }

.mine {
            display: none;
            margin-bottom: 10px;
            font-size: 16px;
        }

.mine button {
            margin-left: 10px;
        }

.pictogram {
            width: 40px;
            height: 40px;
            margin-bottom: 5px;
        }

#message {
            color: red;
            font-weight: bold;
            margin-bottom: 10px;
        }
    </style>
    <script>
        document.addEventListener("DOMContentLoaded", function () {
            var score = 0;
            var clickerLevel = 1;
            var clickerPower = 10;
            var availableMines = 1;

function update() {
                document.getElementById("score").textContent = "Score: " + score;
                document.getElementById("clicker").textContent = "Clicker Level " + clickerLevel + ": " + clickerPower + " points per click";

var shop = document.getElementById("shop");
                while (shop.firstChild) {
                    shop.firstChild.remove();
                }

for (var i = 1; i <= availableMines; i++) {
                    var mineDiv = document.createElement("div");
                    var mineImg = document.createElement("img");
                    var mineButton = document.createElement("button");
                    mineImg.src = "pictogram-mine.png";
                    mineButton.textContent = "Buy Mine " + i + " (Cost: " + i * 10 + ")";
                    mineButton.addEventListener("click", buyMine.bind(null, i));
                    mineDiv.appendChild(mineImg);
                    mineDiv.appendChild(mineButton);
                    shop.appendChild(mineDiv);
                }
            }

function mineClicked() {
                score += clickerPower;
                update();
            }

document.getElementById("clicker").addEventListener("click", mineClicked);

update();
        });
    </script>
</head>
<body>
    <h1>Click Mining Game</h1>
    <div id="score">Score: 0</div>
    <div id="clicker"><img class="pictogram" src="pictogram-clicker.png" alt="Clicker"> Clicker Level 1: 10 points per click</div>
    <div id="shop">
        <div class="mine">
            <img class="pictogram" src="pictogram-mine.png" alt="Mine 1"> 
            <button>Buy Mine 1 (Cost: 10)</button>
        </div>
    </div>
    <div id="message"></div>
</body>
</html>
```

To visualize this game, you would need to save the code as an HTML file and open it in a web browser. You need to have the pictogram images referenced in the `img` tags available in the same directory as the HTML file.