Question

我有以下代码，如果您单击“完整尺寸”按钮，它将打开一个新标签并播放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>

Answer 1

这些控件是chrome固有的。如果您想轻松得多，请在当前窗口中播放视频，然后将其设置为全屏或任意大小。

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

Answer 2

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

这允许您在链接到的页面上使用常规的HTML5视频标记，从而使您可以使用常用的属性来控制是否具有控件。

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

如何隐藏视频控件

2 个答案: