HTML 5 Audio controls

Question

I would like to add a play button somewhere on the page, and when they click it, the player at the bottom will play also, then the play button will disappear. Is that possible? Thanks.

*"Is that possible?"* Yes! Start coding! – Alexander O'Mara Feb 09 '15 at 05:02 — Alexander O'Mara, Feb 09 '15 at 05:02

score 1 · Accepted Answer · answered Feb 11 '15 at 22:22

You need a little bit JavaScript code.
Add an event-listener for the button, select the audio-tag (your player) and call the play-method. Then hide the button with the css-property "display: none;" or "visibility: hidden;" (also with JavaScript).

<button onclick="document.getElementsByTagName('audio')[0].play(); this.style.visibility = 'hidden';">play</button>
<audio controls src="demo.mp3"></audio>

HTML 5 Audio controls

1 Answers1