HTML5视频并没有隐藏控件在全屏模式的Chrome。

时间:2021-10-17 19:00:57

In Google chrome browser when I change to full screen mod standard controls showing when mouse move. Also always enabled function show control on right click menu (only on full screen), I can't disabled it. So I tray this js functions but they not working. JS:

在谷歌chrome浏览器中,当我切换到全屏幕mod标准控件时,鼠标移动。也总是启用功能显示控件右键菜单(只在全屏),我不能禁用它。所以我把这些js功能放在托盘上,但它们不起作用。JS:

$('.gp_nav_fc').click(function() {
    elem = $('#bcVideo')[0];
    if (elem.requestFullscreen) {
        elem.requestFullscreen();
    } else if (elem.mozRequestFullScreen) {
        elem.mozRequestFullScreen();
    } else if (elem.webkitRequestFullscreen) {
         elem.webkitRequestFullscreen();
    }
    $('.gp_buttons').attr('class', 'gp_buttons fullscreen');
        elem.controls = false;
        $('#bcVideo')[0].removeAttribute("controls");
        $('#bcVideo').controls = false;
});

HTML:

HTML:

<video id="bcVideo" src="anotherhost.com/video.mp4" style="position: absolute;" poster="poster.gif"></video>

I change src course it very long, but video getting from another domain.

我改变了src的课程很长,但是视频从另一个领域。

1 个解决方案

#1


13  

So I find answer for this question.

所以我找到了这个问题的答案。

In css need to add next rule:

在css中需要添加下一条规则:

video::-webkit-media-controls {
  display:none !important;
}

more information on link: http://css-tricks.com/custom-controls-in-html5-video-full-screen/

更多关于链接的信息:http://css- passs.com/controls-inhtml5 -video-full-screen/。

#1


13  

So I find answer for this question.

所以我找到了这个问题的答案。

In css need to add next rule:

在css中需要添加下一条规则:

video::-webkit-media-controls {
  display:none !important;
}

more information on link: http://css-tricks.com/custom-controls-in-html5-video-full-screen/

更多关于链接的信息:http://css- passs.com/controls-inhtml5 -video-full-screen/。