在页面加载时隐藏 <video> 控件

Posted 2023-05-07

【中文标题】在页面加载时隐藏 <video> 控件

【英文标题】：Hide <video> controls on page load

【发布时间】：2019-08-04 19:57:35

【问题描述】：

我完全是编码新手，所以请原谅我的无知。我正在使用一切正常工作的标签嵌入视频。我想知道是否有办法在页面加载时隐藏控件并在鼠标悬停在视频上时显示它们；就像它在播放时一样。有什么办法可以做到这一点？

顺便说一句：这是在文档编辑器 (BEE) 的 html 内容框中输入的

谢谢你

编辑：附件是我可以将代码放在哪里的图片。同样，我对这些东西的经验很少。它是文档编辑器中的 html 内容框。

What html box selection looks like Once html box is added to editor

【参考方案1】：

取自：HTML5 video - show/hide controls programmatically

<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>

【讨论】：

我刚刚上传了几张图片到代码所在的位置。我将它粘贴在那里并将 src 更改为我的视频网址，但没有用。有什么帮助吗？ TIA

你说的没用，你看到了什么？我的猜测是 js 部分已从您的编辑器中删除。尝试将脚本标签部分放在允许执行的地方

它显示了所有内容，但如果我点击切换它不会播放

jsfiddle.net/dgLds 它在这里工作，所以如果你复制代码它应该工作。你有链接 Jquery 库吗？