HTML5 Audio display only play pause and mute buttons

被刻印的时光 ゝ 提交于 2019-12-10 01:00:45

问题


I'm wondering if there's a quick and simple way to style the HTML5 audio element to display what I want. I was wondering if you could turn certain controls on and off, but that doesn't seem to be the case.

I do not want a progress/track bar, or to display the time left. I just want a simple play/pause toggle button, and a mute/unmute toggle button.

That's all! Any ideas?


回答1:


Use this code it will serve your purpose.

<!DOCTYPE html>
<html>
<body>
 <audio id="player" src="horse.ogg"></audio>
<div>
    <button onclick="document.getElementById('player').play()">Play</button>
    <button onclick="document.getElementById('player').pause()">Pause</button>
    <button onclick="document.getElementById('player').muted=!document.getElementById('player').muted">Mute/ Unmute</button>
</div>
</body>
</html>



回答2:


You could use the Media API and build your own set of controls with the functionality you want. I've written about this: Working with HTML5 multimedia components – Part 3: Custom controls - which shows a video example, but you can just as easily build an audio one.



来源:https://stackoverflow.com/questions/13810085/html5-audio-display-only-play-pause-and-mute-buttons

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!