HTML5 Video Autoplay With Sound
Last Updated : Mar 11, 2024
IN - HTML HTML5 | Written & Updated By - Amruta
In this tutorial we will show you the solution of HTML5 video autoplay with sound, in our previous session we covered the topic that how we are able to embed video in html with the help of iframe.
We also covered the topics like embed YouTube videos with and without auto play.
Now, today we are here to cover this topic which is how we are able to auto play video with sound in html5.
Sometimes, we found that the video is playing but sound is mute.
So, today we have to solve this problem. We hope that you understand the article properly.
Step By Step Guide On HTML5 Video Autoplay With Sound :-
Now, today as we know that we cover the topic of html5 in which we have to enable the sound in video whereas the video is in already auto play mode.
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 auto play codes.
<!DOCTYPE html>
<html>
<head>
<title>
video
</title>
<style>
video {
position: fixed;
top: 50%;
left: 50%;
background-color: black;
}
</style>
</head>
<body>
<video autoplay="autoplay" loop="" class="this_is_Video" id="this_is_Video">
<source src="video.mp4" type="video/mp4">
Your browser does not support HTML5 video.
</video>
</body>
</html>
- First, we write <! DOCTYPE html> which we used as an instruction to the web browser about what version of HTML file is written in.
- Secondly, the <html> tag is used to indicate the beginning of an HTML document.
- 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.
- So, both have </head> and </title> ending tags respectively. Here, is some CSS codes which we will discuss in next point.
- 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.
- Here, we create a video tag with CSS in style tag. In which we define the position, top and left margin with background color to see the position of video tag.
- In video tag, we set autoplay attribute to autoplay. So, that video played automatically and class, id with same name. You can give the values as you want.
- Inside the source which is placed under video, the source of video is given there. And also content if your browser does not support video tag.
- With the help of this you see that the video automatically plays with its sound. If it is not working, then there is a problem in your browser and you can use iframes instead of video tag.
- 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 auto play a YouTube video in html and also in iframe.
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 HTML5 video autoplay with sound helps you.
About Amruta
