【问题标题】: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/

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2012-08-07
        • 1970-01-01
        • 2011-08-07
        • 1970-01-01
        • 2015-04-20
        相关资源
        最近更新 更多