19

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?

4

2 回答 2

35

使用此代码将达到您的目的。

<!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>
于 2013-06-29T15:06:02.390 回答
6

您可以使用Media API并使用您想要的功能构建您自己的一组控件。我写过这篇文章：使用 HTML5 多媒体组件 - 第 3 部分：自定义控件- 显示了一个视频示例，但您也可以轻松构建一个音频示例。

于 2012-12-11T09:19:32.720 回答