0

I'm trying to get the HTML5 audio tag to show only the play/pause button. This question has been asked before on here, but the answers only gave the option for text 'play!' 'pause!', and not an actual play/pause image .png button.

I have the .png images ready, but having searched the web for days I can't find the answer to this question anywhere. I've tried replacing the text in the above example with an image, but it doesn't work. My coding isn't strong enough, so I keep deleting the code & starting again.

This is what I have:

<audio controls preload="metadata" style=" width:215px; height:18px"><source src="http://www.website.com/audio.mp3" type="audio/mpeg">(Audio player not supported. Click track title to play the audio file)</audio>

Which works just fine, but all I want is for it to work with my own play/pause button image links (2 images), whereby the play image is replaced with the pause image while playing. I don't need the volume, time display, time marker, or the rest of the controls.

Thanks in advance.

Rogelio
  • 1
  • 2
  • try check https://stackoverflow.com/questions/13810085/html5-audio-display-only-play-pause-and-mute-buttons – Stanley01 Feb 25 '20 at 15:14
  • Hi Stanley01, Thanks for that but like I said in my post, their solution doesn't answer my question. They have 3 separate text-based buttons, each showing at the same time. I'm looking for 1 image-based play/pause button that displays a play sign whilst stopped and a pause sign whilst playing, with the .png link in the code, so their solution doesn't work for me. Thanks though – Rogelio Feb 25 '20 at 21:10
  • "This question has been asked before on here, but the answers only gave the option for text 'play!' 'pause!', and not an actual play/pause image .png button." Undoubtedly, all you have to do is replace that text with your image tags... perhaps you should link to what you found. – Brad Feb 26 '20 at 02:11

0 Answers0