All TalkersCode Topics

Follow TalkersCode On Social Media

devloprr.com - A Social Media Network for developers Join Now ➔

HTML Video Autoplay Loop

Last Updated : Mar 11, 2024

HTML Video Autoplay Loop

In this tutorial we will show you the solution of HTML video autoplay loop, in our previous session we already covered the topic that how we are able to embed video in html with the help of iframe with autoplay attribute.

We also covered the topics like embed YouTube videos with and without auto play.

Now, today we are here to cover this topic of how to make video autoplay with loop in html.

Sometimes, we found that when we opens some webpages, a video started playing automatically and after ending of video it again started from beginning.

So, today we have to solve this problem. We hope that you understand the article properly.

Step By Step Guide On HTML Video Autoplay Loop :-

Now, today as we know that we cover the topic of html in which we have to make a video autoplay with loops also.

Hence, there are many ways with the help of we are able to do this. But we will show the suitable one. Now, here below is an example with autoplay with loop codes.

<!DOCTYPE html>
      <html>
        <head>
        <title>
            video
        </title>
</head>
<body>
   <iframe src="https://www.youtube.com/embed/YhvdaNa2oSU?rel=0?autoplay=1&&showinfo=0&loop=1" frameborder="0"></iframe>
<iframe src="https://www.youtube.com/embed/SoD8pqcSXeg?rel=0?autoplay=1&&showinfo=0&loop=1" frameborder="0"></iframe>
</body>
</html>
  1. First, we write <! DOCTYPE html> which we used as an instruction to the web browser about what version of HTML file is written in.
  2. Secondly, the <html> tag is used to indicate the beginning of an HTML document.
  3. As above now <head> tag is used to contain information about web page. In this tag a <title> tag is used which helps us to specify a webpage title. Both <head> and <title> tags are Paired tags.
  4. So, both have </head> and </title> ending tags respectively. Here, is some CSS codes which we will discuss in next point.
  5. Here, we create body tag, which is a paired tag. And all the contents that are being to be displayed on browser screen are written here.
  6. Hence, here we provide you two iframe tags. This article also can be done with the help of embed, object and video with source tag.
  7. In next sessions, we will show you that how you are able to done this article with the help of other tags without iframe tag.
  8. Now, in our body we here create an iframe tag. We think that you already know that what is iframe tag and why it is used.
  9. In this process, we copy the link between embed option and paste in body, the rest code for make the video autoplay and for loop is as: ?rel=0?autoplay=1&&showinfo=0&loop=1
  10. Hence, this code plays main role in this article as for this time period only you have to understand only autoplay and loop.
  11. And in both of them we enables them by giving the value 1. Here, 0 is the off mode whereas 1 is on mode.
  12. At last, the <body> and <html> tags are closed with </body> and </html> respectively.

Conclusion :-

In conclusion, here we can say that with the help of this article you are able to make a video in autoplay and loop mode.

In next session, we also show you how you are able to make a local video auto play in html. I hope this tutorial on HTML video autoplay loop helps you.

Author Image About Riya

A recent graduate with a Bachelor of Technology (B.Tech) in Computer Science from India. She is passionate about leveraging technology to solve real-world problems. With a strong foundation and experience in programming languages such as Python, Django, HTML, CSS, and JavaScript, java, php and have honed her skills through hands-on projects and coursework.

Follow Riya On Linkedin 🡪