我正在寻找一种通过 javascript 随意显示或隐藏 HTML5 视频控件的方法。控件目前仅在视频开始播放时可见
有没有办法用原生视频控件来做到这一点？
我正在使用谷歌浏览器。
HTML5 视频 - 以编程方式显示/隐藏控件
IT技术
javascript
google-chrome
html5-video
2021-01-23 19:30:18
3个回答
<video id="myvideo">
<source src="path/to/movie.mp4" />
</video>
<p onclick="toggleControls();">Toggle</p>
<script>
var video = document.getElementById("myvideo");
function toggleControls() {
if (video.hasAttribute("controls")) {
video.removeAttribute("controls")
} else {
video.setAttribute("controls","controls")
}
}
</script>
看看它在 jsFiddle 上工作：http : //jsfiddle.net/dgLds/
这是如何做到的：
var myVideo = document.getElementById("my-video")
myVideo.controls = false;
工作示例：https : //jsfiddle.net/otnfccgu/2/
在此处查看所有可用的属性、方法和事件：https : //www.w3schools.com/TAGs/ref_av_dom.asp
CARL LANGE还展示了如何在 iOS 设备上的 html5 中隐藏、自动播放音频。为我工作。
在 HTML 中，
<div id="hideme">
<audio id="audioTag" controls>
<source src="/path/to/audio.mp3">
</audio>
</div>
用JS
<script type="text/javascript">
window.onload = function() {
var audioEl = document.getElementById("audioTag");
audioEl.load();
audioEl.play();
};
</script>
在 CSS 中，
#hideme {display: none;}