Javascript 如何隐藏 HTML5 音频控件?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5697724/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 18:30:26  来源:igfitidea点击:

How do you hide HTML5 Audio controls?

javascripthtmlaudiohidehtml5-audio

提问by technopeasant

How can I hide HTML5 audio's browser specific controls? I'm making thumbnail images to represent each track and JavaScript to play/pause.

如何隐藏 HTML5 音频的浏览器特定控件?我正在制作缩略图来代表每个曲目和 JavaScript 来播放/暂停。

Thanks!

谢谢!

HTML:

HTML:

<audio class="thumbnail" id="paparazzi" controls="none">
    <source src="song.ogg" type="audio/ogg" />
    <source src="../audio/fernando_garibay_paparazzisnlmix.mp3" type="audio/mpeg" />
    Your browser does not support HTML5 audio.
</audio>

回答by Shadow2531

The controls attribute is a boolean attribute. This means that if it's specified, controls is true and if it's not specified, controls is false.

控件属性是一个布尔属性。这意味着如果指定,则控件为真,如果未指定,则控件为假。

As far as validity goes, if you want controls to be true, you can specify it these ways:

就有效性而言,如果您希望控件为真,您可以通过以下方式指定它:

<audio controls>
<audio controls="controls">
<audio controls="">

回答by Chris Eberle

Don't specify the controlsattribute at all, this should stop it from showing (I got this after a 5 second google, don't quote me on it).

根本不要指定controls属性,这应该会阻止它显示(我在谷歌 5 秒后得到了这个,不要引用我的话)。

HTML5 video - show/hide controls programmatically

HTML5 视频 - 以编程方式显示/隐藏控件

回答by sukanya

 var audio = document.getElementById('audioFile');
    audio.controls = false;



    <audio  id="audioFile" width="100%" height="auto" controls>
              <source src="xyz.mp3" type="audio/mpeg">
              </audio>