Jump to content

Three things I discovered (by trial-and-error) about the html <audio> tag.


Recommended Posts

1.    In a mobile or tablet PC, an <audio> tag will not be enabled until after a hyperlink has been employed.

So I used a silent "Welcome" screen inviting the user to "click" in order to proceed further.


2.    If  a background audio file is required to survive page transition, then a solution is to use the 
<frameset> tag.  I created two frames called "Left" and "Right".  "Left" width = 0% and "Right" 
width = 100%.  Hence "Left" cannot be displayed.
    The "Left" frame sources a page containing the <audio> tag, while the "Right" frame sources 

    NOTE:  The <frameset> tag was supported in HTML4 but allegedly not in HTML5.


3.    If it is required to stop an audio file playing (after it has started), this may be done by employing any 
hyperlink.  (I am not sure whether this applies to hyperlinks where the href attribute is an external 
URL, eg. a network).  But the condition is that the hyperlink must have the attribute target=_top.  
Such hyperlinks may reference a page containing an alternative <audio> tag and an alternative audio 
file which therefore will replace the one that was stopped.

Link to comment
Share on other sites

  • 4 months later...

When creating a Website it is obviously advantageous to debug it totally within the PC.  This avoids having to upload it to a host in order to debug it.

But when I right-click on "index.html" and select "Open with" and click on "Google Chrome", although the program runs there is no SOUND !  The Chrome html interpreter thus discriminates against against a PC-internal program versus an Internet-derived program.

I presume this is no bug but rather is the consequence of some obscure principle.

Also there seem to be some obscure differences between the treatment of <audio> tags between Chrome on Windows 7 versus Windows 10.  If your websites are old enough to have been created with Winsows 7, you might consider testing the SOUND using Chome on Windows 10.



Link to comment
Share on other sites

  • 5 months later...
  • 4 weeks later...

Sometimes I add audio to websites that I develop.  But when I test my code with my browsers (Chrome and Edge), although they display my code they refuse to play the audio.  Surely this is intentional because they have no trouble playing audio AFTER a website is deployed and given a URL.  So I have found a way to FORCE these browsers to play audio without any URL.  The trick is to use the html instruction "iframe".

The file "index.html" body is as follows:


<iframe src= "welcome.html" style= "height:1024px; width:100%; border:none;">



The file "welcome.html" runs automatically following "index.html".  It MUST contain a hyperlink to the next file which should include the audio code.


Edited by Audiophile
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Create New...