The Document.visibilityState
read-only property returns the visibility of the document
, that is in which context this element is now visible. It is useful to know if the document is in the background or an invisible tab, or only loaded for pre-rendering. Possible values are:
'visible'
- The page content may be at least partially visible. In practice this means that the page is the foreground tab of a non-minimized window.
'hidden'
- The page content is not visible to the user. In practice this means that the document is either a background tab or part of a minimized window, or the OS screen lock is active.
'prerender'
- The page content is being prerendered and is not visible to the user (considered hidden for purposes of
document.hidden
). The document may start in this state, but will never transition to it from another value. Note: This was removed from the standard. Check compatibility table for details.
When the value of this property changes, the visibilitychange
event is sent to the Document
.
Typical use of this can be to prevent the download of some assets when the document is solely prerendered, or stop some activities when the document is in the background or minimized.
Syntax
var string = document.visibilityState
Examples
document.addEventListener("visibilitychange", function() {
console.log( document.visibilityState );
// Modify behavior...
});
Specifications
Specification | Status | Comment |
---|---|---|
Page Visibility (Second Edition) The definition of 'Document.visibilityState' in that specification. |
Recommendation | Initial definition. |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
visibilityState | Chrome
Full support
33
| Edge Full support 12 | Firefox
Full support
18
| IE Full support 10 | Opera
Full support
12.1
| Safari Full support 7 | WebView Android Full support 4.4.3 | Chrome Android
Full support
33
| Firefox Android
Full support
18
| Opera Android
Full support
12.1
| Safari iOS Full support 7 | Samsung Internet Android
Full support
3.0
|
prerender value | Chrome Full support Yes | Edge Full support ≤79 | Firefox Full support 49 | IE ? | Opera ? | Safari ? | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support 49 | Opera Android ? | Safari iOS ? | Samsung Internet Android Full support Yes |
Legend
- Full support
- Full support
- Compatibility unknown
- Compatibility unknown
- Non-standard. Expect poor cross-browser support.
- Non-standard. Expect poor cross-browser support.
- Deprecated. Not for use in new websites.
- Deprecated. Not for use in new websites.
- See implementation notes.
- See implementation notes.
- Requires a vendor prefix or different name for use.
- Requires a vendor prefix or different name for use.