Html5 audio player customization

Asked

Viewed 3,622 times

3

I come with your doubts for some time, there is some possibility of customization of the player audio Html5. So far I know that there is possibility using plugins developed in javascript, but this way there is not yet found to respect.

javascript html css

  • I don’t get it, you want a way that nay use Javascript? Type one that uses CSS only? Or got it wrong?

  • 1

    The way would be to just use the CSS for customization.

1 answer

1


Customizing the player is impossible.

However, you can do different: make it invisible, and create your own custom controls by sending the commands directly to the player, via Javascript.

For example:

<audio id="demo" src="audio.mp3"></audio>
<div>
    <button onclick="document.getElementById('demo').play()">Reproduzir o áudio</button>
    <button onclick="document.getElementById('demo').pause()">Pausar o áudio</button>
    <button onclick="document.getElementById('demo').volume+=0.1">Aumentar o volume</button>
    <button onclick="document.getElementById('demo').volume-=0.1">Diminuir o volume</button>
</div>

*This example was taken from the MDN website, where you can find more details on the subject: Using HTML5 audio and video.

Browser other questions tagged javascript html css

You are not signed in. Login or sign up in order to post.