Show sourcecode
The following files exists in this folder. Click to view.
public_html/gamla-kurser/webbutv2/övningar/js_timers/
js_timers_a.html
js_timers_b.html
js_timers_c.html
js_timers_d.html
js_timers_e.html
js_timers_f.html
js_timers_g.html
js_timers_h.html
js_timers_i.html
js_timers_j.html
sound/
js_timers_d.html
70 lines ASCII Windows (CRLF)
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JS Timers D</title>
</head>
<body>
<h1>JS Timers D</h1>
<button onclick="toggleTimer()" id="startButton">Start</button>
<button onclick="resetTimer()">Reset</button>
<br>
<h2 id="timeScaleHint">Tidsskala: 1x</h2>
<input onchange="updateTimer()" type="range" min="1" max="10" value="1" id="timeScale">
<h2 id="timer">Stoppur: 0 timmar 0 minuter och 0 sekunder.</h2>
<h2 id="text"></h2>
<script>
let timer = document.getElementById("timer");
let text = document.getElementById("text");
let button = document.getElementById("startButton");
let timeScale = document.getElementById("timeScale");
let timeScaleHint = document.getElementById("timeScaleHint");
let count = 0;
let currentInterval = 1000;
let active = false;
let intervalId;
function myTimer() {
count++;
let hours = Math.floor(count / 3600);
let minutes = Math.floor((count % 3600) / 60);
let seconds = count % 60;
timer.innerHTML = `Stoppur: ${hours} timmar ${minutes} minuter och ${seconds} sekunder.`;
}
function toggleTimer() {
if (active) {
clearInterval(intervalId);
button.innerHTML = "Start";
} else {
intervalId = setInterval(myTimer, currentInterval);
button.innerHTML = "Stop";
}
active = !active;
}
function updateTimer() {
if (active) {
clearInterval(intervalId);
currentInterval = 1000/timeScale.value;
intervalId = setInterval(myTimer, currentInterval);
}
else {
currentInterval = 1000/timeScale.value;
}
timeScaleHint.innerHTML = `Tid skala: ${timeScale.value}x`;
}
function resetTimer() {
clearInterval(intervalId);
count = 0;
timer.innerHTML = "Stoppur: 0 timmar 0 minuter och 0 sekunder.";
active = false;
button.innerHTML = "Start";
}
</script>
</body>
</html>