视频标记中的全屏按钮在包含视频的页面在其他页面div上外部加载时丢失
我有一个页面external.php。在此页面中，当我使用以下代码
echo
'<video width="400" controls>
<source src="movie.mp4" type="video/mp4">
</video>';
我在chrome上获得了一个带有全屏按钮的视频。但是当我尝试在另一页external.php div上加载此(home.php)时视频即将到来，但缺少全屏按钮。但是在IE中没有这样的问题。
答案 0 :(得分：1)
您可以通过 CSS 或 Fullscreen API 解决此问题。
<强> 1。 CSS
我认为你可以通过更改#document片段的 css 来实现这一点，这些是DOM1规范并且得到所有浏览器的支持，但是关于样式，我不确定。以下解决方案是 webkit 特定的。
您只需要在css中编写此代码：
video::-webkit-media-controls-fullscreen-button {}
<强> 2。全屏API
如果你想通过Fullscreen API完成它，请先查看以下演示：
正如您可以看到一个非常简单的全屏显示HTML5视频的演示，请确保您每晚都使用 Chrome开发，webkit 或 firefox 。
有关详细信息，请查看here。 浏览器可以提供用户界面，但不应提供可编程的界面。