Question

当您右键单击视频以显示上下文菜单时，我想隐藏前两个选项（循环和显示控件），我只能找到完全隐藏上下文菜单的解决方案...

有人知道什么是正确的标签，以便这两个选项不会显示吗？

示例（右键单击视频）：

var figure = jQuery(".video").hover( hoverVideo, hideVideo );

function hoverVideo(e) {  
    jQuery('video', this).get(0).play(); 
}

function hideVideo(e) {
    jQuery('video', this).get(0).pause(); 
}

    #videosList {
 max-width: 600px; 
  overflow: hidden;
}

.video {
  background-image: url('https://img.youtube.com/vi/nZcejtAwxz4/maxresdefault.jpg');
  height: 330px;
  width: 600px;
  margin-bottom: 50px;
}

/* Hide Play button + controls on iOS */
video::-webkit-media-controls {
    display:none !important;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<div id="videosList">           

<div class="video">
    <video class="thevideo" loop preload="none">
      <source src="https://giant.gfycat.com/VerifiableTerrificHind.mp4" type="video/mp4">
      <source src="https://giant.gfycat.com/VerifiableTerrificHind.webm" type="video/webm">
    Your browser does not support the video tag.
    </video>
  </div>
</div>

Answer 1

通过使用CSS在其上放置一个覆盖div，我发现了纯粹是偶然解决此问题的方法：

position: absolute;
width: 100%;
height: 100%;
opacity: 0;

视频必须位于位置：相对； 显然。

我已经将该div用作文本的容器，但它也解决了我的视频控件问题。

HTML Video right上下文菜单-仅隐藏循环和显示控件

1 个答案: