CODEWITHSUNDEEP
htmlaudio
BryanK
BryanK

Reputation: 1231

html 5 audio pause and play issues

http://jsfiddle.net/BC2VC/

I built an extremely simple audio player. Its just a .png in the background-image: of a <button> that uses .toggleClass() to change the background position of the .png showing a pause button.

I used javascript code that I found on a w3 reference which is a function that links the audio players play and pause events to the <button>.

I have three problems...

One, I cant figure out how to get one audio track to stop when the next when is clicked. I only want one track at a time to be able to play.

Two, if you click the play button for track one it switches to a pause button as it should, but then clicking on track two , both track one and two will show pause buttons. I need track one to switch back to a play button when any other play button is clicked, only one track at a time should show the pause symbol.

The third problem is: The code in the jsfiddle link above works to play the audio everywhere Ive tested except in jsfiddle.

here is a link to a page using the same exact code on my godaddy server...

http://liveoilfree.com/wtrclrwtrclr/index3.html

Upvotes: 0

Views: 312

Answers (1)

Jonathan
Jonathan

Reputation: 9151

  1. I'd recommend using one <audio> object and change it's source when user presses play on another song.
  2. Use a javascript for-loop to reset all the play buttons except the active one.

Link that might help: http://www.html5rocks.com/en/tutorials/webaudio/intro/

Upvotes: 1

Related Questions