Online Timer JavaScript

Display how long a visitor has been on your site using a small reusable timer

Live Example Modern Snippet FAQ
Script Title: Online Timer
Description: Show time on page for the current visitor

Live Example

Starts when the page loads

No libraries
Time on page
00:00:00
Running

Modern online timer snippet

Paste this inside your body It writes elapsed time into an element you choose 

<div id="timeOnPage"></div>

<script>
(function () {
  function pad(n) { return String(n).padStart(2, "0"); }

  function formatElapsed(ms) {
    var totalSeconds = Math.floor(ms / 1000);
    var hours = Math.floor(totalSeconds / 3600);
    var minutes = Math.floor((totalSeconds % 3600) / 60);
    var seconds = totalSeconds % 60;
    return pad(hours) + ":" + pad(minutes) + ":" + pad(seconds);
  }

  function createOnlineTimer(opts) {
    var targetId = (opts && opts.targetId) ? opts.targetId : "timeOnPage";
    var intervalMs = (opts && opts.intervalMs) ? opts.intervalMs : 1000;

    var el = document.getElementById(targetId);
    if (!el) return;

    var start = Date.now();
    var pausedAt = 0;
    var pausedTotal = 0;
    var t = null;

    function render() {
      var now = Date.now();
      var elapsed = now - start - pausedTotal;
      if (elapsed < 0) elapsed = 0;
      el.textContent = formatElapsed(elapsed);
    }

    function startTimer() {
      if (t) return;
      if (pausedAt) {
        pausedTotal += Date.now() - pausedAt;
        pausedAt = 0;
      }
      t = setInterval(render, intervalMs);
      render();
    }

    function pauseTimer() {
      if (!t) return;
      clearInterval(t);
      t = null;
      pausedAt = Date.now();
      render();
    }

    function resetTimer() {
      clearInterval(t);
      t = null;
      start = Date.now();
      pausedAt = 0;
      pausedTotal = 0;
      render();
    }

    startTimer();
    return { start: startTimer, pause: pauseTimer, reset: resetTimer };
  }

  createOnlineTimer({ targetId: "timeOnPage", intervalMs: 1000 });
})();
</script>

FAQ

By default it measures time on the current page For a site wide timer store the first visit time in localStorage and reuse it on each page

Yes Set intervalMs to 250 or 500 if you want smoother updates or leave it at 1000 for once per second updates.

No It uses plain JavaScript and works in modern browsers.