Полноэкранное видео html5 с ограниченным размером div

Кто-нибудь знает, как ограничить полноразмерный лимит видео HTML5 частью экрана, а не всем экраном.

Пример: размер моего экрана 1920 * 1080, где будет отображаться вся моя страница, а в верхней части страницы у меня есть модальное диалоговое окно с разрешением 920 * 800, где я буду отображать список видео, когда я нажимаю на полноэкранный режим любого видео. занимает весь мой размер экрана 1920 * 1080, вместо этого я хочу, чтобы он занимал только 920 * 800, что является размером моего модального диалога. Есть идеи. Любая помощь будет высоко ценится.


person Ajay Srikanth    schedule 03.02.2015    source источник


Ответы (1)


Вы можете развернуть внешний элемент, содержащий тег, вместо того, чтобы делать его полноэкранным, используя requestFullscreen для внешнего элемента из JavaScript:

https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Using_full_screen_mode

К сожалению, если вы включите элементы управления для элемента видео, у него по-прежнему будет собственная полноэкранная кнопка. Могут быть способы скрыть это; вот еще вопрос по теме:

Как скрыть полноэкранную кнопку тег видео в HTML5

но это не кажется возможным во всех браузерах. Лучше всего, вероятно, скрыть все элементы управления видео и реализовать свои собственные элементы управления (есть открытый исходный код, который делает такие вещи, например, video.js).

person aldel    schedule 06.02.2015
comment
Спасибо Алдель. Я попробую это и посмотрю, где я закончу - person Ajay Srikanth; 06.02.2015