如何隐藏视频控件答案

【问题标题】：How to hide video controls如何隐藏视频控件
【发布时间】：2018-12-29 05:55:12
【问题描述】：

我有以下代码，如果您单击“全尺寸”按钮，它会打开一个新选项卡并播放 mp4 视频。但是我似乎无法弄清楚如何隐藏该视频的控件，因为我没有视频标签。

<div class="artworkProject">
 <img src="{{ site.baseurl }}/assets/img/artwork/008">
 <div class="artworkProjectOverlay">
  <p class="artworkProjectOverlayTitle">#008</p>
  <p class="artworkProjectOverlayDate">21.07.2018</p>
  <a href="{{ site.baseurl }}/assets/img/artwork/008.mp4" target="_blank">
   <p class="artworkProjectOverlayButton">Full Size</p>
   <span class="artworkProjectLink"></span>
  </a>
 </div>
</div>

【问题讨论】：

标签： html css video hyperlink controls

【解决方案1】：

如果您确实需要或想让链接打开一个新页面，最简单的方法可能是让链接指向一个简单的 HTML 页面以及您要播放的视频名称或网址。

这允许您在链接到的页面上使用常规的 HTML5 视频标签，允许您使用通常的属性来控制您是否拥有控件。

您可以在此处看到一个工作示例，该示例显示了 javascript 访问 URL 参数并使用它来设置 HTML5 视频标签中的视频源（链接而不是再次复制，这是一个全面的示例，通过以下方式检查登陆页面错误）：https://stackoverflow.com/a/28399606/334402

【讨论】：

【解决方案2】：

这些控件是 chrome 原生的。如果您想要更轻松的时间，请在当前窗口中播放视频，并将其设置为全屏或所需的任何大小。

您也可以探索此选项：https://css-tricks.com/custom-controls-in-html5-video-full-screen/

【讨论】：