问题标签 [html5-fullscreen]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
android - html全屏：禁用android上的状态栏
我注意到升级到 Android 8 后，状态栏不再在 Chrome 上html5全屏隐藏。有没有办法隐藏这个？以前的 Android 版本并非如此。
铬： 64.0.3282.137
操作系统： Android 8.0.0，HTC 10 Build/OPR1.170623.0267
javascript - 为什么触摸端不能全屏？
一旦用户开始在移动设备上滚动，我就试图让页面全屏显示。
我知道正如这个mdn 链接中所述，出于可用性原因，浏览器将只允许页面占据全屏以响应用户手势，因此，我需要将我的请求发送到 full-快速事件处理程序中的屏幕，因此我执行了以下操作：
但是，当我滚动页面时，我在 chrome 上得到了这个结果：
我必须在这里遗漏一些东西，因为当我单击时，不拖动指针，它确实有效。
PS：脚本的完整版本可以在这个 [fiddle] .. ( https://jsfiddle.net/OsvaldoM/0kpm1s93/13/ ) 中找到，这只是一个实验，所以请不要介意它的可怕影响将不得不 UX
html5-video - videojs：“退出全屏，因为全屏元素已从文档中删除。”
我在 videojs HTML5 Player 的全屏切换时遇到问题。
在这里，我在一个页面 ( https://yiddishevinkel.com/archives/9555 ) 上有两个视频，其中主视频看起来不错。但是侧边栏中的视频，我无法切换到全屏模式。当我点击全屏切换时，它切换到全屏并立即退出全屏模式，并在 Firefox 控制台中显示“退出全屏，因为全屏元素已从文档中删除。 ”警告。
请注意，问题仍然存在于页面和 chrome 上的单个视频实例。
javascript - webkitRequestFullscreen() 在 android 上更改 chrome 上网页的视口/尺寸
对于应用程序，我需要将 android 上的 chrome 发送到全屏模式。
我知道我需要使用Fullscreen API，这涉及调用Element.webkitRequestFullscreen().
所以，我之所以这么说，document.body是因为我希望将所有内容都置于全屏模式并利用所有手机屏幕。
然而问题是屏幕被调整大小/质量下降。这严重破坏了我的应用程序（正在为虚拟现实绘制画布），因为我需要我能得到的所有分辨率！
要演示屏幕已放大并丢失可绘制像素，请从检查我的手机的控制台中查看：
显然，innerWidth进入innerHeight全屏时会减少一些东西，但我不知道是什么。
我尝试过调整包含在正文中的画布的不同大小，但无济于事。
但我认为解决方案是添加一个视口：
我还尝试设置明确的内容宽度：
但这些似乎都没有对网页的行为产生任何影响，所以我不确定我是否把它们放错了（在 中<head>）或者我的语法是否错误，但它们并没有改变任何东西。
javascript - element.RequestFullScreen() & element.msRequestFullScreen() 未针对 IE 和 Microsoft Edge 显示
背景资料：
单击每个视频缩略图图像将全屏播放视频，兼容跨浏览器
做了什么：
已创建以下附在下面的源代码
问题：
Chrome 可以全屏播放视频，但 IE 和 Microsoft Edge 无法播放视频
请参阅下面的源代码：
会不会不支持浏览器的版本控制？还是我缺少允许视频在 IE 和 Edge 上播放的代码？
javascript - 使用全屏 API 触发全屏时，双指缩放在 macOS (Chrome) 上不起作用
在 macOS 上，可以通过触控板使用“捏合缩放”手势来缩放页面。
当页面不是全屏时，此功能在 Chrome 上正常工作。使用 Chrome 窗口右上角的绿色按钮触发全屏时，它也可以正常工作。
但是，当使用 HTML5 全屏 API ( webkitRequestFullscreen-- https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API ) 以编程方式触发全屏时，“捏缩放”手势被禁用。
可以在这里进行测试：当使用右上角的绿色按钮触发全屏时，“捏缩放”有效；使用“请求文件”时，它不起作用。
macOS 上似乎有两种不同的全屏模式，但很难找到有关它的任何信息。
javascript - 将 HTML5 全屏 (MAP) 移动到第二个屏幕
我在我的 AngularJS 应用程序中使用传单地图并为我遇到的问题寻找解决方案。
我想将地图的全屏移动到第二个屏幕（如果可用），以便用户能够继续在主屏幕上使用该应用程序，但我找不到任何解决方案并且不再知道......
有没有办法做到这一点？
javascript - JavaScript全屏无法滚动
我使用下面的脚本对页面进行了全屏切换，但是当页面全屏时出现问题，它无法向下滚动。overflow: scroll我尝试为全屏添加 CSS ，但没有任何反应。
我希望有人可以帮助我解决这个问题。谢谢。
HTML：
JavaScript：
CSS：
firefox - 视频全屏退出导致滚动位置改变
我特别遇到了 Firefox 的问题（我使用的是 61.0.1 版（64 位）），在退出页面上向下滚动的视频元素的全屏时，它会导致 body 的 scrollTop 返回到不正确的位置。
要测试的示例代码如下（...导致页面变长的多个元素在哪里）：
小提琴示例：https ://jsfiddle.net/webbm/p8ws3yc9/
在我的示例中，我尝试将 HTML 保留为一些非常基本的元素，以免引入 CSS 相关问题。
在上面的例子中：
- 退出第一个视频的全屏后，主体的 scrollTop 位于正确的位置。
- 退出第二个视频的全屏后，主体的 scrollTop 向上移动。
- 即使只有第二个视频元素，这种行为仍然会发生，所以我认为这与存在多个视频元素无关。
这是解决方法的已知问题吗？
html5-fullscreen - 在任何元素上初始化全屏时没有任何效果
我在一个 WordPress 网站上工作，我有一个 YouTube 视频，其中全屏不工作。在iframe allowfulscreen='true'设置上，当您单击全屏图标时，它会初始化某些内容，但是原始主体是可见的，而不是 youtube 视频或换句话说它的iframe. 经过检查，iframe尽管视频不可见，但它看起来已经覆盖了页面。
我尝试设置z-index值和opacity值以确保它不是 CSS 的问题，但是正如我使用$0.webkitRequestFullScreen相同的问题进行的随机元素全屏测试一样。知道可能是什么原因吗？