WEBLEB
Startseite
Editor
Anmelden
Pro
Deutsch
English
Français
Español
Português
Deutsch
Italiano
हिंदी
5018
Sampath122
Im Editor öffnen
Veröffentlichen Sie Ihren Code
Empfohlen
22 July 2025
Einblick in die Funktion
25 July 2025
HTML-Anmeldeseitenvorlage
HTML
Copy
<!DOCTYPE html> <html> <head> <title>Click the Circle Game</title> <link rel="stylesheet" href="Game.css"> </head> <body> <div class="game-container"> <div class="circle" id="circle"></div> <p>Score: <span id="score">0</span></p> </div> <script src="main.js"></script> </body> </html>
CSS
Copy
body { display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0; } .game-container { text-align: center; } .circle { width: 100px; height: 100px; background-color: red; border-radius: 50%; position: relative; cursor: pointer; animation: moveCircle 2s infinite; } @keyframes moveCircle { 0% { left: 0; } 50% { left: calc(100% - 100px); } 100% { left: 0; } }
JS
Copy
let score = 0; document.getElementById('circle').addEventListener('click', () => { score++; document.getElementById('score').innerText = score; });
