Как настроить полноэкранный видеоплеер iframe в мобильном браузере Chrome? - PullRequest
0 голосов
/ 28 декабря 2018

Я недавно отвечаю за ведение видео сайта.На сайте используется Fluid Player, встроенный в iframe в качестве видеоплеера.И это может нормально полный экран на ПК Chrome.Но в мобильном Chrome основной видеоконтент не заполняет весь плеер после нажатия кнопки полного экрана.И пользователю нужно потратить дополнительное время на настройку автоматического горизонтального экрана телефона, чтобы достичь нормального полноэкранного режима видеопроигрывателя.

Мой вопрос заключается в том, как настроить обычное вращение видеоконтента (в полноэкранном режиме) после нажатия пользователем полного экрана проигрывателя.экранная кнопка в мобильном (например, Android) Chrome.

Я пробовал много видео проигрывателей с открытым исходным кодом, но ни один из них не работает так же хорошо, как мобильный Youtube сайт.

Ниже кодаэто пример разметки страницы с вышеупомянутым iframe и страницей iframe проигрывателя видео.

<iframe src="example.com/video-player?videoId=123"
        allowfullscreen="allowfullscreen"
        mozallowfullscreen="mozallowfullscreen"
        msallowfullscreen="msallowfullscreen"
        oallowfullscreen="oallowfullscreen"
        webkitallowfullscreen="webkitallowfullscreen"></iframe>

<link rel="stylesheet" href="https://cdn.fluidplayer.com/v2/current/fluidplayer.min.css" type="text/css"/>
<script src="https://cdn.fluidplayer.com/v2/current/fluidplayer.min.js"></script>

<video id="video-id">
    <source src="video.mp4" type="video/mp4"/>
</video>

<script>
    fluidPlayer("video-id");
</script>
   

-

- нажмите здесь, чтобы посмотреть неожиданный полноэкранный скриншот

нажмите здесь, чтобы увидеть неожиданныйполный экран

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...