Apparently for a video to be in fullscreen there needs to be interaction with the user. Most players , including the native HTML5 have ' fullscreen ' button.
I'm building an interactive offline platform and need to click on a teaser button to automatically open a player by playing a video on fullscreen > and that at the end stay on or go back to the screen that was:
Ithoughtofthesetwosolutions,whicharewithinmycurrentprogrammingcapacity:
1)CreateanotherHTMLpagewiththefollowingcodes:
<bodyclass="fadein">
<video id=video autobuffer autoplay="true">
<source src="media_v/video.mp4">
<object type="video/mp4" data="media_v/video.mp4" width="1366"
height="768">
</object>
</video>
<script>
document.getElementById('video').addEventListener('ended',myHandler,false);
function myHandler(e) {
window.location.href = "menu_option.html";
}
</script>
It turns out that in this mode it does not take the whole screen, even with the measurements having the native resolution of the screen 1366x768, it leaves a border and I can not get through the entire screen object without the user clicking the fullscreen , not even using:
<script>
var elem = document.getElementById("video");
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.mozRequestFullScreen) {
elem.mozRequestFullScreen();
} else if (elem.webkitRequestFullscreen) {
elem.webkitRequestFullscreen();
}
</script>
or
video id=video autobuffer autoplay="true" fullscreen="true"
Is there "fullscreen = 'true'"?
2) The other way I thought was that clicking the 'button' already open a video 'as content overlay' in fullscreen mode, like the Facebook player, but in this case I think I do not even know where to start, so here I am.