Simple Audio Element Play Button

This is a basic start stop button that plays an audio clip.

  • This example is designed for short clips that don't need a pause feature that allows for play to be restarted wherever it was stopped

  • A "Stop" feature is included. It can be removed if the clip is short enough that it doesn't benefit much from it

  • If the click is long enough to warrant a Stop feature it's worth considering adding play/pause functionality too

  • The button starts displaying the word "Play"

  • The audio plays when the button is clicked

  • The text of the button also changes to "Stop" when the button is clicked

  • Clicking the button again while the audio is playing (and displaying "Stop") stops the audio and changes the text back to "Play" which can then be used to play the audio again

  • Clicking "Stop" resets the play-head to the beginning of the audio so the track starts from the beginning on the next play

  • The text of the audio in the example is "Hello, my name is Tom. I am an American English voice"