title: HTML video pause when window is minimized
body: <p>I have a html file that contains a video. I want to add a feature to pause video when the window is minimized or the tab is changed on browser.</p>
  
  <p>How can add that feature to my html?</p>
  
  <p>I added javascript function but video is still being played in any condition</p>
  
  <p>edit: sharing my code.</p>
  
  <pre><code>    &lt;!DOCTYPE html&gt;
  &lt;html&gt; 
  &lt;script src="//code.jquery.com/jquery-1.11.1.min.js"&gt;&lt;/script&gt;
  
  
  
  &lt;head&gt; 
  &lt;meta content="text/html; charset=utf-8" http-equiv="Content-Type" /&gt; 
  &lt;title&gt;Untitled 1&lt;/title&gt; 
  &lt;/head&gt; 
  &lt;body&gt; 
  
   &lt;video id="videoPlayer" width="640" height="480" position="center" controls&gt;
    &lt;source src="\\TEKPC1366\Users\BerkayS\Desktop\DataModel2\DataModel3\DataModelYazisiz.mp4" type="video/mp4" /&gt;
    &lt;source src="\\TEKPC1366\Users\BerkayS\Desktop\DataModel2\DataModel3\DataModelYazisiz.mp4.webm" type="video/webm" /&gt;
    &lt;track src="C:\Users\BerkayS\Desktop\DataModel2\DataModel3\deneme.vtt" kind="subtitles" srclang="tu" label="Türkçe" /&gt;
    &lt;track src="C:\Users\BerkayS\Desktop\DataModel2\DataModel3\denemeenglish.vtt" kind="subtitles" srclang="en" label="English" /&gt;   
    &lt;track src="C:\Users\BerkayS\Desktop\DataModel2\DataModel3\denemedeutsch.vtt" kind="subtitles" srclang="de" label="Deutsch" /&gt;
    &lt;track src="C:\Users\BerkayS\Desktop\DataModel2\DataModel3\denemespanish.vtt" kind="subtitles" srclang="es" label="Espanol" /&gt;
    &lt;track src="C:\Users\BerkayS\Desktop\DataModel2\DataModel3\denemerussian.vtt" kind="subtitles" srclang="ru" label="русский" /&gt;
    &lt;track src="C:\Users\BerkayS\Desktop\DataModel2\DataModel3\denemearabic.vtt" kind="subtitles" srclang="ar" label="العربية" /&gt;
  
  &lt;/video&gt;
  
  
    &lt;script
  window.onfocus = function() {kaf()};
  window.onblur = function() {kef()};
  
  function kaf() {
   document.getElementById('videoPlayer').play(); 
  
  }
  
  function kef() {
   document.getElementById('videoPlayer').pause(); 
  }
  
    &lt;/script&gt;
  
  
  &lt;/body&gt; 
  &lt;/html&gt;
  </code></pre>