html5视频全屏到限制div大小

时间:2015-02-03 23:39:47

标签: html5 html5-video html5-fullscreen

有没有人知道如何将HTML5视频全尺寸限制限制在屏幕的一部分而不是整个屏幕。

示例:我的屏幕尺寸为1920 * 1080,我的整个页面都会显示在页面顶部我有一个920 * 800的模态对话框,当我点击时,我将显示视频列表全屏任何视频它占据我的整个屏幕尺寸1920 * 1080,而不是它我想它只占用920 * 800,这是我的模态对话框大小。有什么想法吗。任何帮助都将受到高度赞赏。

1 个答案:

答案 0 :(得分:0)

您可以通过在JavaScript的外部元素上使用requestFullscreen来全屏显示包含标记的外部元素,而不是使其自身全屏:

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

不幸的是,如果你在视频元素上启用控件,它仍然会有自己的全屏按钮。可能有办法隐藏它;这是关于该主题的另一个问题:

How to hide full screen button of the video tag in HTML5

但似乎并非所有浏览器都可以。最好的办法可能是隐藏所有视频控件,并实现自己的控件(那里有开放源代码,就像video.js一样)。