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:
$('.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:
<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.
We can hide the controls by not adding the controls attribute to the video element. Even without controls attribute on the elements the user can view the controls section by right-clicking on the video and enabling the show controls .
Full-screen can be activated for the whole browser window by pressing the F11 key. It can be exited by pressing the Esc button.
So I find answer for this question.
In css need to add next rule:
video::-webkit-media-controls {
display:none !important;
}
more information on link: http://css-tricks.com/custom-controls-in-html5-video-full-screen/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With