Gioco Super Clicker

53 Lspath940

Apri nell'Editor Video Pubblica il Tuo Codice

Consigliato

25 January 2026

Incorpora il gioco Flash con Ruffle Player

18 December 2025

Codice sorgente HTML del gioco Divide By 1

18 December 2025

Caricatore HTML del gioco Boom Slingers ReBoom

HTML

<!DOCTYPE html>

<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Super Clicker Game</title>
  <style>
    /* General body styling */
    body {
      font-family: Arial, sans-serif;
      display: flex;
      flex-direction: column;
      align-items: center;
      background-color: #f0f8ff;
      margin: 0;
      padding: 20px;
    }

h1 {
      color: #333;
    }

#clicker-container {
      text-align: center;
      margin-top: 50px;
      padding: 20px;
      background-color: #ffffff;
      border-radius: 10px;
      box-shadow: 0px 0px 15px rgba(0,0,0,0.2);
      width: 300px;
    }

button {
      font-size: 18px;
      padding: 15px 30px;
      cursor: pointer;
      margin: 10px;
      border-radius: 8px;
      border: none;
      color: white;
      background-color: #007bff;
      transition: background-color 0.3s;
    }

button:hover {
      background-color: #0056b3;
    }

#stats {
      margin-top: 20px;
    }

.upgrade {
      display: block;
      margin: 10px 0;
      font-size: 16px;
      background-color: #28a745;
    }

.upgrade:hover {
      background-color: #1e7e34;
    }
  </style>
</head>
<body>
  <h1>Super Clicker Game</h1>
  <div id="clicker-container">
    <p>Clicks: <span id="clicks">0</span></p>
    <button id="click-button">Click Me!</button>

<div id="stats">
      <p>Clicks per second (CPS): <span id="cps">0</span></p>
    </div>

<h3>Upgrades</h3>
    <button class="upgrade" id="auto-clicker">Buy Auto-Clicker (+1 CPS) - Cost: <span id="auto-cost">50</span></button>
    <button class="upgrade" id="double-click">Buy Double Click (+1 Click per click) - Cost: <span id="double-cost">100</span></button>
  </div>

// Upgrade costs
    let autoClickerCost = 50;
    let doubleClickCost = 100;

// HTML element references
    const clickDisplay = document.getElementById('clicks');
    const cpsDisplay = document.getElementById('cps');
    const clickButton = document.getElementById('click-button');
    const autoClickButton = document.getElementById('auto-clicker');
    const doubleClickButton = document.getElementById('double-click');
    const autoCostDisplay = document.getElementById('auto-cost');
    const doubleCostDisplay = document.getElementById('double-cost');

// Click button logic
    clickButton.addEventListener('click', () => {
      clicks += clicksPerClick;
      updateDisplay();
    });

// Auto-clicker purchase
    autoClickButton.addEventListener('click', () => {
      if (clicks >= autoClickerCost) {
        clicks -= autoClickerCost;
        cps++;
        autoClickerCost = Math.floor(autoClickerCost * 1.5); // Increase cost
        autoCostDisplay.textContent = autoClickerCost;
        updateDisplay();
      }
    });

// Double click purchase
    doubleClickButton.addEventListener('click', () => {
      if (clicks >= doubleClickCost) {
        clicks -= doubleClickCost;
        clicksPerClick++;
        doubleClickCost = Math.floor(doubleClickCost * 2); // Increase cost
        doubleCostDisplay.textContent = doubleClickCost;
        updateDisplay();
      }
    });

// Auto-click logic
    setInterval(() => {
      clicks += cps;
      updateDisplay();
    }, 1000);

// Update display function
    function updateDisplay() {
      clickDisplay.textContent = clicks;
      cpsDisplay.textContent = cps;
    }

updateDisplay(); // Initial display
  </script>
</body>
</html>

Consigliato

Incorpora il gioco Flash con Ruffle Player

Codice sorgente HTML del gioco Divide By 1

Caricatore HTML del gioco Boom Slingers ReBoom

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS