Wie kann ich einen Timer in HTML reinprogrammieren?
Hallo! Ich würde gerne einen 5 Minuten Timer in meine Webseite reinmachen, weiß aber nicht, wie ich den Code verfassen soll, dass er noch in einer Box ist. Kann mir bitte jemand weiterhelfen?
LG
1 Antwort
Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer
HTML, Webseite, Programmieren & Softwareentwicklung
Mit JavaScript:
<!doctype html>
<title>Example</title>
<span id="timer"></span>
<script>
const timeOutput = document.getElementById("timer");
let timerValue = 5;
const timer = setInterval(() => {
if (timerValue >= 0) {
timeOutput.textContent = timerValue;
--timerValue;
}
else {
clearInterval(timer);
}
}, 1000 * 60);
</script>
Die setInterval-Funktion ruft die ihr übergebene anonyme Funktion jede Minute einmal auf. In dieser wird eine Variable timerValue heruntergezählt und der Wert in das span-Element geschrieben, sofern er noch größer/gleich 0 ist. Andernfalls wird die Intervallzählung beendet.