title: Javascript to stop HTML5 video playback on modal window close
body: <p>I've got a html5 video element on a modal window.  When I close the window the video continues to play.  I'm a total newbie to JS.  Is there an easy way to tie a video playback stop function to the window close button?  Below is my html page:</p>
  
  <pre><code>&lt;!DOCTYPE html &gt;
  &lt;html lang="en"&gt;
  
  &lt;head&gt;
  &lt;meta charset="utf-8" /&gt;
  &lt;title&gt;Modal Test&lt;/title&gt;
  
  &lt;script type="text/javascript" src="jquery.js"&gt;
  
  &lt;/script&gt;
  
  &lt;script type="text/javascript"&gt;
      $(document).ready(function(){
          $("#showSimpleModal").click(function() {
              $("div#simpleModal").addClass("show");
              return false;   
          });
  
          $("#closeSimple").click(function() {
              $("div#simpleModal").removeClass("show");
              return false;                   
          });
      });
  &lt;/script&gt;
  
  &lt;style type="text/css"&gt;
  
  div#simpleModal
  {
      position:absolute; 
      top: 40px; 
      width: 320px; 
      left: 170px; 
      border: solid 1px #bbb;     
      padding: 20px; 
      background: #fff; 
      -webkit-box-shadow: 0px 3px 6px rgba(0,0,0,0.25); 
      opacity: 0.0; 
      -webkit-transition: opacity 0.0s ease-out; z-index: 0;
  }
  
  div#simpleModal.show
  {
      opacity: 1.0; 
      z-index: 100;        
      -webkit-transition-duration: 0.25s; 
  }
  
  &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;a href="" id="showSimpleModal"&gt;Show Modal&lt;/a&gt;
  
  &lt;div id="simpleModal" class="modal"&gt;
  &lt;video width="320"  height="240" src="Davis_5109iPadFig3.m4v" controls="controls"&gt; &lt;/video&gt;
  &lt;a href="" id="closeSimple"&gt;Close&lt;/a&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Any input greatly appreciated.</p>
  
  <p>Thanks.</p>