title: How can i make a html video play one once, until the page is reloaded
body: <p>Sup hackers!</p>
  
  <p>So I've tried and searched for hours and cant seems to find a solution. On my page i made it to where the video automatically plays when the user scrolls to a certain point of the page. It works great, but I find it annoying how the video will loop over and over. I just want the video to play only ONCE, until the user reloads the page or visits a new page and comes back. Then the video can play again. Here is what i got!</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;video id="vid" width="400"&gt;
        &lt;source src="assets/img/me.mp4" type="video/mp4"&gt;
          Your browser does not support HTML5 video. Please update your browser.
  &lt;/video&gt;
  </code></pre>
  
  <p>JAVASCRIPT:</p>
  
  <pre><code>$(window).scroll(function(){
      var myVideo = document.getElementById("vid");
      // console.log($(window).scrollTop());
      if($(window).scrollTop() &gt; 300 &amp;&amp; $(window).scrollTop() &lt; 975){
          myVideo.play();
      }else{
              myVideo.pause();
      }
  })
  </code></pre>
  
  <p>nothing to special, pretty stright forward. I understand there is a html5 attribute for loops called "loop", I dont know if this could be my answer or not? iv'e seen in some HTML5 docs for the loop attribute and value 0 seems like what im looking for? but not sure how to go about it? </p>
  
  <p>Value 0 (default): The video will play only once.</p>
  
  <p>Value 1: The video will loop (forever).</p>
  
  <p>Thanks in advance Ladies and Gents! I really do appreciate your time.</p>