JavaScript Error

You currently have JavaScript disabled on your web browser.

This website uses JavaScript, and This web page needs JavaScript activated to work correctly.

Please active JavaScript on your web browser and then refresh this web page.

Audio Player

In this blog post I am referring to the Audio Player feature that is available with HTML5.

The audio element is used to play audio files (MP3, OGG, or WAV) from a web page.

Example Source Code

In the following example, I use the audio element to play an m4a audio sound track (as an mp3). I set the controls attribute to have the element automatically add player controls (play, pause, volume):


    <audio controls style="height:22px;">
        <source src="SoundTrack01.m4a" type="audio/mp3">
        Your browser does not support the audio element.

In the event that the users web browser does not support the audio element, you can either display a message to them (as in the example above) or you can provide them with an alternative method of playing the audio sound file, such as in the following example:


    <audio controls style="height:22px;">
        <source src="SoundTrack01.m4a" type="audio/mp3">
        <a href="SoundTrack01.m4a" target="_blank">
            <img src="speaker32x32.png" alt="audio track">

When you run the above example then you should see something similar to the following screenshot image (unless your web browser does not support the audio element):


The actual source code from the example shown above used in this web page is as follows:

Final Thoughts

Thank you for reading, I hope you found this blog post (tutorial) educational and helpful.

(0) pollYesResult
(0) pollNoResult

     About   |   Contact Us   |   Privacy   |   Terms & Conditions   |   © 2024 - T&J Divisions, LLC, All Rights Reserved