title: Vimeo Fullscreen Background Not Autoplaying
body: <p>I'm reusing a very basic HTML &amp; CSS code sample from Codepen, but as soon as I replace the video ID number from Vimeo with the one that comes with the code sample it doesn't autoplay. Nothing else is different in the CSS or HTML. Nothing else changed so I have no idea why my video I've uploaded doesn't autoplay upon loading the page. </p>
  
  <p>Any Ideas?</p>
  
  <p><strong>Original Code:</strong></p>
  
  <pre><code>      &lt;section class="home-section home-full-height bg-dark-30" id="home" data-background="assets/images/section-5.jpg"&gt;
  &lt;div class="vimeo-wrapper"&gt;
     &lt;iframe src="https://player.vimeo.com/video/76979871?background=1&amp;autoplay=1&amp;loop=1&amp;byline=0&amp;title=0"
             frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen&gt;&lt;/iframe&gt;
  &lt;/div&gt;
        &lt;/section&gt;
  </code></pre>
  
  <p><strong>My updated HTML with different video ID number:</strong></p>
  
  <pre><code>      &lt;section class="home-section home-full-height bg-dark-30" id="home" data-background="assets/images/section-5.jpg"&gt;
  &lt;div class="vimeo-wrapper"&gt;
     &lt;iframe src="https://player.vimeo.com/video/297135145?background=1&amp;autoplay=1&amp;loop=1&amp;byline=0&amp;title=0"
             frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen&gt;&lt;/iframe&gt;
  &lt;/div&gt;
        &lt;/section&gt;
  </code></pre>
  
  <p><strong>Link to the actual URLs that are being called:</strong></p>
  
  <p><a href="https://player.vimeo.com/video/297135145" rel="nofollow noreferrer">https://player.vimeo.com/video/297135145</a></p>
  
  <p><a href="https://player.vimeo.com/video/76979871" rel="nofollow noreferrer">https://player.vimeo.com/video/76979871</a></p>
  
  <p><strong>Codepen Link:</strong>
  <a href="https://codepen.io/abennington/pen/ZONqqv" rel="nofollow noreferrer">https://codepen.io/abennington/pen/ZONqqv</a></p>
  
  <p><strong>Two Different URLs on my site to show that one is working and the other is not:</strong></p>
  
  <p><strong>Working:</strong> <a href="http://knpdesign.co/vimeoworking.html" rel="nofollow noreferrer">http://knpdesign.co/vimeoworking.html</a>
  <strong>Not:</strong> <a href="http://knpdesign.co/" rel="nofollow noreferrer">http://knpdesign.co/</a></p>