Full screen video toggle HTML

Question

Видео тег в HTML 5 действительно увлекательный. Мне нужно знать, можно ли позволить пользователям переключать полноэкранную игру. Я не хочу использовать какой-либо другой видео-плагин. Мне просто нужно использовать тег видео. Это возможно. Пожалуйста, помогите мне ....

Answer 1

Вы можете использовать следующий код для создания кнопки который приведет видео в полноэкранный режим.

Javascript код:

<script type="text/javascript"> 
function goFullscreen(id) { 
    var element = document.getElementById(id);  
    if (element.mozRequestFullScreen) { 
    element.mozRequestFullScreen(); 
    } else if (element.webkitRequestFullScreen) { 
    element.webkitRequestFullScreen(); 
    } 
} 
</script> 

Html код:

<video class="video_player" id="player" width="100%" controls="controls" autoplay="autoplay"> 
    <source src="INPUT VIDEO URL HERE"/> 
    Your browser does not support the HTML5 video tag. Use a better browser! 
</video> 
<button onclick="goFullscreen('player'); return false"> 
    View Fullscreen! 
</button> 

Answer 2

Согласно this website, только половина всех «больших браузеров» поддерживает полноэкранное воспроизведение. Мой Google Chrome на самом деле сбой при попытке сделать полноэкранный режим. Со временем, однако, будет глобальный переключение.

Answer 3

Да. Возможно. Однако в большинстве браузеров есть некоторые ограничения. В настоящее время поддерживается только (по состоянию на июнь 2012 года) в браузерах на базе Webkit, таких как Safari и Chrome.

Пожалуйста, проверьте следующее:

1. http://videojs.com/
2. http://blog.jilion.com/2011/07/27/world-s-first-true-html5-fullscreen-video (работает только в Safari)
3. http://easyhtml5video.com/
4. http://johncblandii.com/2011/07/html5-video-fullscreen.html