Detect if Browser Tab is in the view

roeib · web-flow · commit af8ebc291826 · 2020-06-16T09:42:21.000+03:00
diff --git a/README.md b/README.md
@@ -32,6 +32,7 @@
 |26 | [getBoundingClientRect](#getBoundingClientRect)|
 |27 | [Check if a node is in the viewport](#Check-if-a-node-is-in-the-viewport)|
 |28 | [Notify when element size is changed](#Notify-when-element-size-is-changed)|
+|29 | [Detect if Browser Tab is in the view](#Detect-if-Browser-Tab-is-in-the-view)|
 
 
 
@@ -592,6 +593,23 @@ const observer = new ResizeObserver((entries) => {
 });
 observer.observe(foo);
 
+```
+**[⬆ Back to Top](#table-of-contents)**
+### Detect if Browser Tab is in the view
+play/pause video accordingly
+see our codepen: https://codepen.io/JSsnippets/pen/gOapPzq
+```javascript
+
+
+const video =  document.getElementById("my-video");
+
+const onVisibilitychange =()=>{
+   return document.hidden 
+     ? video.pause() 
+     : video.play();
+} 
+
+document.addEventListener("visibilitychange", onVisibilitychange)
 
 ```
 
