Q:

Set youtube video on background

I'm using bootstrap and I want to set youtube video on background
I found this. How could I change this code to use video from youtube? replacing  with  doesn't work

    @import url('http://fonts.googleapis.com/css?family=Oswald');
    
    body {
      margin: 0;
      padding: 0;
      background-attachment: fixed;
      background-size: cover;
    }
    
    #video-background {
      position: fixed;
      right: 0; 
      bottom: 0;
      min-width: 100%; 
      min-height: 100%;
      width: auto; 
      height: auto;
      z-index: -100;
    }
    <video autoplay="" loop="" class="fillWidth fadeIn animated" poster="https://s3-us-west-2.amazonaws.com/coverr/poster/Traffic-blurred2.jpg" id="video-background">
        <source src="https://s3-us-west-2.amazonaws.com/coverr/mp4/Traffic-blurred2.mp4" type="video/mp4">
    </video>

A:

I found good solution here.
.video-background {
  background: #000;
  position: fixed;
  top: 0; right: 0; bottom: 0; left: 0;
  z-index: -99;
}
.video-foreground,
.video-background iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

A:

OH HI EVERYONE, here is a reusable simple jQuery plugin I made based on YouTube Embed API. It's also super simple to use. You can see it in action here.
<div id="ytbg" data-youtube="https://www.youtube.com/watch?v=eEpEeyqGlxA"></div>

<script type="text/javascript">
    jQuery(document).ready(function() {
        $('[data-youtube]').youtube_background();
    });
</script>

Code on GitHub

A:

In your body just add those lines.Change the id number.     
 <div style="position: fixed; z-index: -99; width: 100%; height: 100%">
      <iframe frameborder="0" height="100%" width="100%" 
        src="https://youtube.com/embed/ID?autoplay=1&controls=0&showinfo=0&autohide=1">
      </iframe>
 </div>

