カウントダウンタイマー — 任意の日時まで秒単位で表示
目標日時を選ぶと、その日時までの残り時間を秒単位でカウントダウンします。イベント名を付けることもでき、目標を過ぎると経過時間に切り替わります。
仕組み
動作の仕組み
1秒に1回 setInterval で再計算します。毎回ブラウザのローカル時刻を取得して目標時刻との差を求め、日・時・分・秒に分解して表示します。サーバー通信が発生しないため、ネットワーク切断中もタイマーは正確に動き続けます(ページの読み込み完了後のみ)。
タイムゾーンはブラウザの「ローカルタイム」を使用します。目標を「今日の12:00」に設定し、別タイムゾーンの人がそのページを開くと、各人の現地12:00までの残り時間が表示されます(どちらも正しい挙動です)。
よくある利用シーン
プロジェクトの締切(会議室のモニタに常時表示)、サービス・製品ローンチ(公開日までの残り時間)、旅行(出発日や搭乗時刻)、資格試験、結婚式・記念日、スポーツイベント。任意のイベント名を入れておくと、画面を見ただけで何のカウントダウンか分かります。
目標時刻を過ぎると、同じ表示が「経過時間」に切り替わって増えていきます。「最後のインシデントから何日経ったか」のようなSRE用ダッシュボードや「最終投稿から○○時間」のような運用にも活用できます。
カレンダーリマインダーとの違い
カレンダーは「その時刻に1回だけ通知」です。カウントダウンは常に視界の片隅に「残り時間」を表示し続けるため、目標を意識し続けたい時に有効です。スポーツチームのロッカールームや、ソフトウェアチームのウォールーム、マラソンランナーのトレーニングモニタなどで使われます。
公開ダッシュボードに置きたい場合はURLをブックマークしてください。状態は入力欄に保持されます(再読み込みすると初期化されます。共有用URL機能は今後追加予定)。
よくある質問
›1秒精度ですか?
はい。1秒に1回画面を更新し、毎回現在時刻から再計算しているため、累積的なずれは発生しません。
›タイムゾーンはどう扱われますか?
ブラウザのローカルタイムゾーンで解釈されます。目標時刻もローカルタイム基準で入力されます(UTCではありません)。
›オフラインでも動きますか?
ページ読み込み後はオフラインでも動作します。ネットワーク接続は不要です。
›他人と共有できますか?
現状はURL共有機能はありません。状態をURLにエンコードする機能を計画中です。スクリーンショットや画面録画で共有可能です。
›目標時刻を過ぎたらどうなりますか?
「経過時間」表示に切り替わり、目標時刻からの経過時間がカウントアップされます。
›複数のカウントダウンを同時に動かせますか?
ブラウザの別タブで開けば独立して動作します。1ページで複数イベントを管理する機能は今後の予定です。
›他のタブに切り替えても動き続けますか?
ブラウザはバックグラウンドタブのsetIntervalを抑制しますが、戻った瞬間に現在時刻から再計算されるため、表示は正しく追いつきます。
›入力データはサーバーに送信されますか?
いいえ。すべてブラウザ内で完結します。
関連ツール
最終更新: