valentin/ImePriimekMestoDrzavaZival
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
Valentin Korenjak
2025-01-16 20:38:44 +01:00
commit b60b6dde6d
3 changed files with 82 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
imepriimekmdz.html Normal file
View File

@@ -0,0 +1,18 @@
<!DOCTYPE html>
<html lang="sl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Naključna črka z odštevalnikom</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div id="letter-container">
<span id="letter"></span>
<div id="timer">Preostali čas: 60s</div>
</div>
<script src="script.js"></script>
</body>
</html>

37
script.js Normal file
View File

@@ -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();

27
styles.css Normal file
View File

@@ -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;
}