From b60b6dde6d5e94246fc3329ba638488ef2ffb60a Mon Sep 17 00:00:00 2001 From: Valentin Korenjak Date: Thu, 16 Jan 2025 20:38:44 +0100 Subject: [PATCH] first commit --- imepriimekmdz.html | 18 ++++++++++++++++++ script.js | 37 +++++++++++++++++++++++++++++++++++++ styles.css | 27 +++++++++++++++++++++++++++ 3 files changed, 82 insertions(+) create mode 100644 imepriimekmdz.html create mode 100644 script.js create mode 100644 styles.css diff --git a/imepriimekmdz.html b/imepriimekmdz.html new file mode 100644 index 0000000..bc89e44 --- /dev/null +++ b/imepriimekmdz.html @@ -0,0 +1,18 @@ + + + + + + Naključna črka z odštevalnikom + + + +
+ +
Preostali čas: 60s
+
+ + + + + diff --git a/script.js b/script.js new file mode 100644 index 0000000..42f6047 --- /dev/null +++ b/script.js @@ -0,0 +1,37 @@ +// Slovenska abeceda +const alphabet = [ + 'A', 'B', 'C', 'Č', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', + 'N', 'O', 'P', 'R', 'S', 'Š', 'T', 'U', 'V', 'Z', 'Ž' +]; + +// Funkcija za naključno izbiro črke +function getRandomLetter() { + const randomIndex = Math.floor(Math.random() * alphabet.length); + return alphabet[randomIndex]; +} + +// Funkcija za zagon odštevalnika +function startTimer() { + let timeLeft = 60; // začetni čas (60 sekund) + + const timerElement = document.getElementById('timer'); + + // Funkcija, ki posodablja preostali čas vsakih 1000 ms (1 sekunda) + const timerInterval = setInterval(function() { + timeLeft--; + timerElement.textContent = `Preostali čas: ${timeLeft}s`; + + // Ko čas doseže 0, ustavimo odštevalnik + if (timeLeft <= 0) { + clearInterval(timerInterval); + timerElement.textContent = 'Čas je potekel!'; + } + }, 1000); +} + +// Prikaz naključne črke na spletni strani +document.getElementById('letter').textContent = getRandomLetter(); + +// Zaženemo odštevalnik +startTimer(); + diff --git a/styles.css b/styles.css new file mode 100644 index 0000000..0bdcfbb --- /dev/null +++ b/styles.css @@ -0,0 +1,27 @@ +body { + font-family: Arial, sans-serif; + display: flex; + justify-content: center; + align-items: center; + height: 100vh; + margin: 0; + background-color: #f0f0f0; + flex-direction: column; +} + +#letter-container { + text-align: center; +} + +#letter { + font-size: 200px; + font-weight: bold; + color: #333; +} + +#timer { + font-size: 24px; + margin-top: 20px; + color: #333; +} +