File tree Expand file tree Collapse file tree 1 file changed +18
-0
lines changed Expand file tree Collapse file tree 1 file changed +18
-0
lines changed Original file line number Diff line number Diff line change 3232| 26 | [ getBoundingClientRect] ( #getBoundingClientRect ) |
3333| 27 | [ Check if a node is in the viewport] ( #Check-if-a-node-is-in-the-viewport ) |
3434| 28 | [ Notify when element size is changed] ( #Notify-when-element-size-is-changed ) |
35+ | 29 | [ Detect if Browser Tab is in the view] ( #Detect-if-Browser-Tab-is-in-the-view ) |
3536
3637
3738
@@ -592,6 +593,23 @@ const observer = new ResizeObserver((entries) => {
592593});
593594observer .observe (foo);
594595
596+ ` ` `
597+ **[⬆ Back to Top](#table-of-contents)**
598+ ### Detect if Browser Tab is in the view
599+ play/pause video accordingly
600+ see our codepen: https://codepen.io/JSsnippets/pen/gOapPzq
601+ ` ` ` javascript
602+
603+
604+ const video = document .getElementById (" my-video" );
605+
606+ const onVisibilitychange = ()=> {
607+ return document .hidden
608+ ? video .pause ()
609+ : video .play ();
610+ }
611+
612+ document .addEventListener (" visibilitychange" , onVisibilitychange)
595613
596614` ` `
597615
You can’t perform that action at this time.
0 commit comments