Audio tag without a volume slider or mute button?

Question

I created an audio tag without a download button with

This was successful.

Now,

Answer 1

Try this:

audio::-webkit-media-controls-mute-button {
    display: none !important;
}

audio::-webkit-media-controls-volume-slider {
    display: none !important;
}

Answer 2

The new controlslist attribute in the HTML5 standard can only accept three settings:

"nodownload", "nofullscreen" and "noremoteplayback".

There are none to control specific controls beside from that. The only (current) workaround for this is to build your own custom interface for the audio object and provide only the controls you want the user to access via the UI.

The attribute is currently only supported in Chrome and Opera, as well as Android. This of course being another incentive to build a custom UI for the audio (or use a library as suggested by Johannes).

Answer 3

For the HTML5 audio tag there is only controls or nothing, and each browser will display it a little differently. But there is not way to have only some of the controls displayed.

To achieve that, you'd have to use a javascript/jQuery player like jPlayer ( http://jplayer.org/) that allows complete individual cofiguration of the UI (but still uses HTML5 in the background).