Перейти на полный экран с HTML5 видео на iPad / iPhone - PullRequest
Новая
       0

Перейти на полный экран с HTML5 видео на iPad / iPhone

8 голосов
/ 15 марта 2011

Я пытаюсь воспроизвести и перейти в полноэкранный режим для видеоэлемента HTML5 на iPad / iPhone через JavaScript, но при попытке выполнить videoElement.webkitEnterFullScreen () я вижу INVALID_STATE_ERR: исключение Dom 11.

Мой Код

Для Пример

Теперь, похоже, что специфическая поддержка это поведение было добавлено здесь:

, который специально предотвращает переход в полноэкранный режим без жеста пользователя.

Мой вопрос:

Есть ли обходной путь для этого?

Я вижу, что видеоплеер Vimeo HTML5 имитирует это поведение, как показано здесь (на iPad / iPhone)

Итак, кажется, что это возможно.Я что-то упустил?

Ответы [ 2 ]

5 голосов
/ 21 августа 2012

Тестирование на iOS симуляторе Ipad

Надеюсь, я смогу кому-нибудь помочь: 

<html>
<head>
 <script src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
 <script type="text/javascript">
    var vid;

    function init() {
        vid = document.getElementById("myVideo");
        vid.addEventListener("loadedmetadata", goFullscreen, false); 
    }

    function goFullscreen() {
        vid.webkitEnterFullscreen();
    }

    $(document).ready(function(){
        init();

        $("#myVideo").bind('ended', function(){
            $('#myVideo')[0].webkitExitFullScreen();
        });
    });
 </script>
</head>
<body>
    <h1>Fullscreen Video</h1>
    <video src="movie.mp4" id="myVideo" autoplay controls >
    </video>
</body>
</html>
0 голосов
/ 28 сентября 2015

Я использовал это, и у меня это сработало 

- (void) makeHTML5VideoFullscreen {
    if(webView) {
        [webView stringByEvaluatingJavaScriptFromString: @"document.querySelector('video').webkitEnterFullscreen();"];
    }
}
...