CODEWITHSUNDEEP
htmlcssvideoyoutubebackground
secondsight
secondsight

Reputation: 115

Youtube video as background for webpage

I need youtube video as background for my web page. This is my code

<section class="about-section">

           <div class="video-background">
<div class="video-foreground">
  <iframe src="https://www.youtube.com/embed/UY9V5S9MEgk?controls=0&showinfo=0&rel=0&autoplay=1&loop=1&playlist=W0LHTWG-UmQ" frameborder="0" allowfullscreen></iframe>
</div> </div> </section>

This is working fine. My issue is I need to use the following youtube video as my background but it is not working. I tried these two URLs but not working

https://youtu.be/UY9V5S9MEgk

Theese are URL's I have tried

https://www.youtube.com/watch?v=UY9V5S9MEgk

Upvotes: 2

Views: 5565

Answers (4)

Aiyoub A.
Aiyoub A.

Reputation: 5391

Try this:

<section class="about-section">   
  <div class="video-background">
    <div class="video-foreground">
      <iframe src="https://www.youtube.com/embed/UY9V5S9MEgk" frameborder="0" allowfullscreen>
      </iframe>
    </div> 
  </div> 
</section>


<!DOCTYPE html>
<html>
<body>

<iframe width="420" height="345" src="https://www.youtube.com/embed/UY9V5S9MEgk">
</iframe>

</body>
</html>

Upvotes: 0

Aaqib Akhtar
Aaqib Akhtar

Reputation: 63

Try this:

<div style="position: fixed; z-index: -99; width: 100%; height: 100%">
  <iframe frameborder="0" height="100%" width="100%" 
    src="https://youtube.com/embed/UY9V5S9MEgk?autoplay=1&controls=0&showinfo=0&autohide=1">
  </iframe>
</div>

Upvotes: 1

Yadhu Babu
Yadhu Babu

Reputation: 1509

Copy the embed code of your youtube video and replace it with your current 

<iframe width="854" height="480" src="https://www.youtube.com/embed/UY9V5S9MEgk?controls=0&showinfo=0&rel=0&autoplay=1&loop=1&playlist=W0LHTWG-UmQ" frameborder="0" allowfullscreen></iframe>

Upvotes: 1

user1727852
user1727852

Reputation: 143

this question is already solved [click here][1]

if you have any query please message me.

[1]: https://codepen.io/dudleystorey/pen/PZyMrd

and [click here][1]

  [1]: https://www.labnol.org/internet/youtube-video-background/27933/

Upvotes: 0

Related Questions