Document: visibilitychange イベント

visibilitychange イベントは、タブのコンテンツが表示状態または非表示状態になったときに document に発生します。

バブリング あり
キャンセル可能 いいえ
インターフェイス Event
イベントハンドラープロパティ onvisibilitychange

使用上の注意

このイベントには、更新された文書の表示・非表示状態が含まれていませんが、この情報は document の visibilityState プロパティから取得することができます。

例

この例は、文書が表示状態になった時に音楽を再生し、文書が非表示になった時に音楽を停止します。

document.addEventListener("visibilitychange", function() {
  if (document.visibilityState === 'visible') {
    backgroundMusic.play();
  } else {
    backgroundMusic.pause();
  }
});

仕様書

仕様書 状態 備考
Page Visibility (Second Edition)
visibilitychange の定義		 勧告

ブラウザーの互換性

No compatibility data found. Please contribute data for "api.Document.visibilitychange" (depth: 1) to the MDN compatibility data repository.

関連情報