The visibilitychange event is fired when the content of a tab has become visible or has been hidden.
General info
- Specification
 - Page Visibility API
 - Interface
 event- Bubbles
 - Yes
 - Cancelable
 - No
 - Target
 Document- Default Action
 - None
 
Properties
| Property | Type | Description | 
|---|---|---|
target Read only  |  
    EventTarget |  
    The event target (the topmost target in the DOM tree). | 
type Read only  |  
    DOMString |  
    The type of event. | 
bubbles Read only  |  
    boolean |  
    Does the event normally bubble? | 
cancelable Read only  |  
    boolean |  
    Is it possible to cancel the event? | 
Example
document.addEventListener("visibilitychange", function() {
  console.log( document.visibilityState );
});
Specifications
| Specification | Status | Comment | 
|---|---|---|
| Page Visibility API The definition of 'visibilitychange' in that specification.  | 
   Recommendation | 
Browser compatibility
| Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) | 
|---|---|---|---|---|---|
| Basic support | 13 webkit 33  | 
   10 (10) moz 18 (18)  | 
   10 | 
     12.10[1]  | 
   6.1 | 
| Feature | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile | 
|---|---|---|---|---|---|
| Basic support | 4.4 webkit | 10.0 (10) moz 18.0 (18)  | 
   ? | 12.10 [1] | 7 | 
[1] Doesn't fire the visibilitychange event when the browser window is minimized, nor set hidden to true.