👁️ ifvisible.js

A tiny, dependency-free way to know whether your user is looking at the page — and whether they're still there.

v3.x 0 dependencies ESM · CJS · IIFE supported: …

This whole page is wired to one ifvisible instance. Try it: switch tabs, minimize, or just stop touching your mouse/keyboard and watch.

Live status

😀
ACTIVE
ifvisible.now() === true

Idle countdown · getIdleInfo()

30.0s
until you're marked idle

Controls

Smart interval · onEvery(1, …)

💓
0
ticks while visible

This 1s interval auto-pauses when you go idle or hide the tab, and resumes when you're back — no ticks are wasted.

Event stream

    Listening to focus, blur, idle, wakeup, statusChanged, and the Page Lifecycle freeze / resume events.

    That was all of this

    import ifvisible from "ifvisible.js";

// React to attention
ifvisible.on("blur",  () => video.pause());
ifvisible.on("focus", () => video.play());

// React to inactivity (default 30s)
ifvisible.setIdleDuration(30);
ifvisible.on("idle",   () => stream.pause());
ifvisible.on("wakeup", () => stream.resume());

// Intervals that pause themselves when nobody's watching
ifvisible.onEvery(1, () => poll());