All TalkersCode Topics

Follow TalkersCode On Social Media

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

HTML Audio Autoplay Not Working

Last Updated : Mar 11, 2024

HTML Audio Autoplay Not Working

In this tutorial we will show you the solution of HTML audio autoplay not working, in HTML today we will discuss about how to make audio autoplay which in not working.

It means that sometimes, we found that some tags are not applicable for all browsers.

So, how we are able to use html audio autoplay that is not in working condition.

So, today we will understand how we are able to make a html audio autoplay that is in not working due to any error.

Step By Step Guide On HTML Audio Autoplay Not Working :-

Let us understand how we enable audio autoplay. For, this first condition is that we can use iframe instead of object/ embed or for audio tag also.

We can use iframe tag instead of these tags. But if you want to use only specific tag which you already use.

Then there is a code given below which helps you to make audio autoplay that is not working.

<!DOCTYPE html>
      <html>
        <head>
          <title> Title of the document</title>
</head>
<body>
<iframe src="silence.mp3" allow="autoplay" id="audio" hidden ></iframe>
    <!-- <iframe src="silence.mp3" allow="autoplay" id="audio" style="display: none;"></iframe> -->
    <audio id="player" autoplay controls>
        <source src="audio.mp3" type="audio/mp3">
        <source src="audio.org" type="audio/org">
    </audio>
</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.
  4. 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.
  5. Thirdly, <body> tag is used to define the webpage body. All the contents to show on website are written here.
  6. Here, we want to say that if you want to use audio that is in autoplay mode or may be hidden, then you can use iframe tag there.
  7. But if due to some reasons you want to make audio tag runnable. Then there is a trick for you, For this you have to play silence.mp3 with the help of iframe tag.
  8. The iframe is hidden there which can be make hidden with the help of display: none or you can also use hidden property there.
  9. And after this you are able to make your audio tag autoplay.
  10. The file that is silence.mp3 is of around 0.5 to 1 sec which do not affect you audio file. And after playing this you are able to run any other file which we want to make autoplay.
  11. Here after iframe, we create an audio tag with property of autoplay and inside this we give source to audio tag in which we link the file of audio which we want to play.
  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 we are able to make audio autoplay in html which is not working. I hope this tutorial on HTML audio autoplay not working helps you.

Author Image About Amruta

Amruta is an Experienced web developer with 4 years for experience she completed her master's with MCA and passionate about programming Languages for creating technical contents like HTML, CSS, JavaScript, Java, Python, PHP, jQuery.

Follow Amruta On Linkedin 🡪