HTML5video – 以编程方式显示/隐藏控件
我正在寻找一种方法来通过javascript显示或隐藏HTML5video控件。 这些控件目前仅在video开始播放时才可见
有没有办法做到这一点本地video控制？
我正在使用谷歌Chrome浏览器。
<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/
CARL LANGE还展示了如何在iOS设备上以html5自动播放audio。 为我工作。
在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;}
以下是如何做到这一点：
var myVideo = document.getElementById("my-video"). myVideo.controls = false;
工作示例： https ： //jsfiddle.net/otnfccgu/2/
查看所有可用的属性，方法和事件： https ： //www.w3schools.com/TAGs/ref_av_dom.asp
