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

No:35180

Game most clicker with leaderboard
Developer User16442｜Date and time 24/1/13 13:27:48
Build time 8.349 sec｜Game capacity 2.172KB｜

Script

Welcome to the Clicker Game!

Tap/click the button as many times as you can!

Your current score is: 0

Leaderboard:

←

Prev　Next

→ 　

Back　

[PR]現在の人気ゲームランキング

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

<!DOCTYPE html>
<html>
<head>
  <title>Clicker Game</title>
  <style>
    body {
      text-align: center;
      font-family: Arial, sans-serif;
    }

h1 {
      margin-top: 200px;
      font-size: 40px;
    }

#score {
      font-size: 30px;
      margin-top: 50px;
    }

#clickBtn {
      padding: 10px 20px;
      font-size: 18px;
      margin-top: 20px;
    }

#leaderboard {
      margin-top: 50px;
      font-size: 24px;
    }

ol {
      list-style-type: none;
      padding: 0;
      margin: 0 auto;
      max-width: 300px;
    }

li {
      line-height: 1.5;
    }
  </style>
</head>
<body>
  <h1>Welcome to the Clicker Game!</h1>
  <p>Tap/click the button as many times as you can!</p>
  <p>Your current score is: <span id="score">0</span></p>
  <button id="clickBtn">Tap / Click here!</button>
  <h2>Leaderboard:</h2>
  <ol id="leaderboard">
    <li>Loading...</li>
  </ol>

// Variables
    var score = 0;
    var leaderboard = [];

// DOM Elements
    var scoreElement = document.getElementById('score');
    var clickBtn = document.getElementById('clickBtn');
    var leaderboardElement = document.getElementById('leaderboard');

// Event Listener for button click
    clickBtn.addEventListener('click', function() {
      score++;
      scoreElement.textContent = score;

if (score === 10) {
        endGame(); // End the game after reaching a score of 10
      }
    });

// Function to end the game
    function endGame() {
      clickBtn.removeEventListener('click');
      clickBtn.disabled = true;

var playerName = prompt('Congratulations! Enter your name for the leaderboard:');
      leaderboard.push({ name: playerName, score: score });

leaderboard.sort(function(a, b) {
        return b.score - a.score;
      });

leaderboardElement.innerHTML = '';

for (var i = 0; i < leaderboard.length; i++) {
        var listItem = document.createElement('li');
        listItem.textContent = (i + 1) + '. ' + leaderboard[i].name + ' - ' + leaderboard[i].score;
        leaderboardElement.appendChild(listItem);
      }
    }
  </script>
</body>
</html>