HandyTools Hub

Countdown-Timer

Zählen Sie zu jedem Ereignis mit Live-Aktualisierung herunter

Voreingestellte Ereignisse

Benutzerdefiniertes Ereignis

--

00

Tage

00

Stunden

00

Minuten

00

Sekunden

Manche Termine sind wichtig genug, um ihr Nahen zu verfolgen: ein Produktstart, eine Hochzeit, eine Prüfung oder Silvester. Dieser Countdown-Timer zeigt die verbleibenden Tage, Stunden, Minuten und Sekunden bis zu einem Moment Ihrer Wahl und aktualisiert sich jede Sekunde live. Er enthält Voreinstellungen für Neujahr, Weihnachten und Valentinstag sowie einen eigenen Modus für ein Datum Ihrer Wahl. Weil er das Ziel als absoluten Zeitpunkt liest, statt einen Zähler herunterzuzählen, bleibt er über lange Zeiträume sowie über Schlaf- und Tab-Drosselung hinweg genau.

Einen Countdown festlegen

  • Drücken Sie eine Voreinstellungs-Schaltfläche, um den Countdown auf Neujahr, Weihnachten oder Valentinstag zu starten. Die Bezeichnung der Voreinstellung wird zum Titel über der Anzeige.
  • Oder geben Sie einen Ereignistitel ein (bis zu 50 Zeichen; leer lassen verwendet „Custom Event“), wählen Sie ein lokales Datum und eine Uhrzeit und drücken Sie auf Countdown setzen.
  • Die vier großen Felder zeigen Tage, Stunden, Minuten und Sekunden. Sie aktualisieren sich einmal pro Sekunde ohne Neuladen der Seite.
  • Der Titel erscheint über der Anzeige, damit Sie erkennen, welche Frist auf dem Bildschirm läuft, wenn mehrere Tabs geöffnet sind. Das Setzen eines neuen Ereignisses ersetzt das vorherige und startet das Intervall neu.

Die Anzeige lesen

Jedes Feld wird mit führenden Nullen auf zwei Stellen aufgefüllt, ein Countdown von sechs Stunden erscheint also als 00 / 06 / 00 / 00, nicht als 6. Die Felder sind unabhängige Reste, nicht ein Bruchteil eines Ganzen: 90.061 Sekunden sind ein Tag, eine Stunde, eine Minute und eine Sekunde, nicht „1,04 Tage“. Das Tagesfeld wächst bei langen Horizonten weiter, ein zwei Jahre langer Countdown zeigt im Tagesfeld also etwa 730. Es gibt kein Feld für Wochen oder Monate, was die Mehrdeutigkeit unterschiedlich langer Monate vermeidet.

Wie der Timer Drift vermeidet

Der Timer hält einen einzigen Zustand: das Ziel als absoluten Zeitstempel. Bei jedem Tick zieht er die aktuelle Zeit von diesem Zeitstempel ab und teilt die Differenz in Tage, Stunden, Minuten und Sekunden auf. Er vermindert niemals einen Zähler. Dieses Design ist wichtig, weil setInterval nur ungefähr arbeitet – Hintergrund-Tabs werden gedrosselt und ein schlafendes Laptop pausiert die Uhr vollständig. Die Neuberechnung aus dem Ziel bedeutet, dass jeder Tick für sich korrekt ist und die Anzeige sich selbst korrigiert, sobald sie wieder läuft. Teilsekunden werden abgerundet, sodass sich der sichtbare Wert an ganzen Sekundengrenzen ändert und nicht mitten in der Sekunde.

Voreinstellungen, UTC und eigene Zeiten

Dies ist das eine Verhalten, das man verstehen sollte, bevor man sich auf eine Voreinstellung verlässt. Feiertags-Voreinstellungen sind auf Mitternacht UTC am Feiertagsdatum verankert, während ein eigenes Ereignis die lokale Zeit verwendet, die Sie in das Datumsfeld eingeben. Für einen Betrachter in UTC+8 erreicht die Neujahrs-Voreinstellung am 1. Januar um 08:00 Uhr Ortszeit null, nicht um lokale Mitternacht. Für einen Betrachter in UTC−5 ist es am 31. Dezember um 19:00 Uhr so weit. Wenn die exakte lokale Mitternacht wichtig ist, tragen Sie das Datum stattdessen als eigenes Ereignis ein. Die Voreinstellungen werden beim Laden der Seite erzeugt, ist ein Feiertag also vorbei, verschiebt ein Neuladen die Schaltfläche auf das nächste Vorkommen.

Durchgerechnetes Beispiel

Angenommen, ein eigenes Ereignis wird genau 1 Tag, 1 Stunde, 1 Minute und 1 Sekunde in der Zukunft festgelegt. Das sind 90.061 Sekunden. Der Timer rechnet 90.061 ÷ 86.400 = 1 Tag mit 3.661 verbleibenden Sekunden; 3.661 ÷ 3.600 = 1 Stunde mit 61 verbleibenden Sekunden; 61 ÷ 60 = 1 Minute mit 1 verbleibenden Sekunde. Die Anzeige liest 01 / 01 / 01 / 01. Eine Sekunde später beträgt die Summe 90.060, das Sekundenfeld zeigt also 00. Läge dasselbe Ziel eine Sekunde in der Vergangenheit, würden alle vier Felder 00 anzeigen und die abgelaufene Meldung erschiene.

Praktische Verwendungen

  • Halten Sie einen Launch, eine Abgabefrist, eine Prüfung oder eine Reise auf einem zweiten Monitor sichtbar, während Sie arbeiten.
  • Projizieren Sie einen Countdown bei einer Live-Veranstaltung, einem Webinar oder im Klassenzimmer auf einen geteilten Bildschirm.
  • Verfolgen Sie die verbleibende Zeit, bis ein Sale, ein Anmeldefenster oder ein Meeting endet.
  • Zählen Sie auf einen Feiertag herunter, ohne die Tagesdifferenz selbst auszurechnen.
  • Nutzen Sie den eigenen Titel, um zu kennzeichnen, welche Frist auf dem Bildschirm läuft, wenn mehrere Tabs geöffnet sind.

Wenn der Countdown null erreicht

In dem Moment, in dem das Ziel erreicht oder überschritten wird, liefert der Timer ein abgelaufenes Ergebnis: Jedes Feld wird auf null gesetzt und die Meldung „Event has passed!“ erscheint. Das Intervall läuft weiter, ist die Seite beim Eintreffen der Null also bereits geöffnet, erfolgt der Wechsel beim nächsten Tick. Das Tool endet dort – es zählt nicht aufwärts, klingelt nicht und sendet keine Benachrichtigung, behandeln Sie es also als Anzeige und nicht als Wecker. Wenn Sie eine Warnung brauchen, lassen Sie den Tab sichtbar oder halten Sie einen separaten Timer bereit.

Countdown, Stoppuhr und Uhr

Ein Countdown unterscheidet sich von den anderen Zeit-Tools dieser Seite. Eine Stoppuhr zählt ab dem Start aufwärts und misst somit verstrichene Zeit; eine Weltuhr zeigt die aktuelle Zeit in einer anderen Zone; ein Countdown ist dasjenige, das auf einen festen zukünftigen Zeitpunkt zeigt und auf ihn zuschrumpft. Wenn Sie messen möchten, wie lange eine Aufgabe dauert, verwenden Sie die Stoppuhr. Wenn Sie wissen möchten, „wie lange noch“, verwenden Sie diesen Timer. Der Unterschied ist wichtig, wenn eine Frist als Datum und Uhrzeit statt als Dauer angegeben ist, weil nur der Countdown diesen Endpunkt in eine lebendige Restzeitanzeige verwandeln kann.

Verwandte Tools

Häufig gestellte Fragen

Warum speichert der Countdown ein absolutes Datum, statt jede Sekunde herunterzuzählen?

Weil Browser-Timer nicht exakt sind. Jeder Tick zieht die aktuelle Uhrzeit vom gespeicherten Ziel ab, sodass die Anzeige auch dann stimmt, wenn der Tab gedrosselt wird, das Laptop schläft oder ein Tick verspätet eintrifft. Ein Zähler, der einfach jede Sekunde eins abziehen würde, würde driften.

Meine eigene Zeit wirkt um mehrere Stunden verschoben. Welche Zeitzone verwendet der Countdown?

Ein eigenes Ereignis nutzt das lokale Datum und die lokale Uhrzeit, die Sie eingeben. Die integrierten Feiertags-Voreinstellungen sind auf Mitternacht UTC verankert, in manchen Zeitzonen erreicht eine Voreinstellung daher zu einer anderen lokalen Stunde null. Wenn Sie lokale Mitternacht brauchen, tragen Sie den Feiertag als eigenes Ereignis ein.

Was passiert mit den voreingestellten Daten, nachdem der Feiertag vorbei ist?

Die Voreinstellungen werden bei jedem Laden der Seite aus der Browser-Uhr neu berechnet. Nachdem der 1. Januar vorbei ist, zeigt die Neujahrs-Schaltfläche nach dem Neuladen auf das Datum des folgenden Jahres; für Weihnachten und Valentinstag gilt dasselbe.

Gibt es eine maximale Anzahl von Tagen, die ein Countdown anzeigen kann?

Es gibt keine praktische Grenze. Die verbleibende Zeit ist eine JavaScript-Zahl in Sekunden, die mühelos jahres- oder jahrzehntelange Ziele abdeckt. Das Tagesfeld wächst einfach über zwei Stellen hinaus.

Läuft der Countdown in einem Hintergrund-Tab genau weiter?

Ja, aber die visuellen Aktualisierungen können langsamer werden, weil Browser Timer in verborgenen Tabs drosseln. Da jeder Tick aus dem absoluten Ziel neu berechnet wird, sind die Zahlen korrekt, sobald der Tab wieder sichtbar ist.

Was wird im exakten Moment angezeigt, in dem der Countdown null erreicht?

Alle vier Felder werden auf 00 gesetzt und die Meldung „Event has passed!“ erscheint. Es werden keine negativen Werte angezeigt, und der Countdown spielt keinen Ton ab und löst keine Benachrichtigung aus.

Geprüft vom HandyTools-Hub-Team · Zuletzt aktualisiert