问题标签 [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.

0 投票
2 回答
15810 浏览

reactjs - 在 ReactJs JSX 中设置属性 mozallowfullscreen 或 webkitAllowFullScreen

我正在尝试在这样的网页中包含 Vimeo Iframe(JSX 代码):

渲染的是这样的:

如何实现所需的 mozAllowFullScreen 和 webkitAllowFullScreen 属性?在 React Docs ( https://facebook.github.io/react/docs/dom-elements.html#all-supported-html-attributes ) 中只提到了 allowfullscreen 属性?

0 投票
1 回答
547 浏览

javascript - 在 iPad 上以全屏模式自动关闭视频

当以全屏模式播放视频时,我想在视频结束时退出全屏。我有这个在桌面和安卓上工作,但不是在我的 iPad 上(v10.3.2)

退出全屏的代码如下所示

当视频结束时尝试退出时,我的 iPad 上不存在这些功能。

这是触发全屏的代码:

有什么建议为什么在我的 iPad 上失败?

0 投票
0 回答
381 浏览

html - html5lightbox video popup Mobile view 全屏问题

我正在使用 HTML 5 灯箱弹出窗口播放视频。我一直在通过另一个网站的网络服务调用视频,并使用这种方法使用 html5-light-box 弹出窗口将视频流式传输到我的播放器中

一切正常,但在移动设备上查看时,全屏视频控件隐藏。当检查视频底部显示的元素时

0 投票
1 回答
4237 浏览

firefox - Firefox 全屏视频附加 DOM 元素

无论我如何将 DOM 中的元素作为 html5 视频的叠加层(静态或动态),Firefox 中的这些元素都是不可见的,尽管 z-index 设置为 2147483647、不透明度 1 和显示块。

查看 2 个类似的答案,在 Chrome 中工作,但在 FF 中没有:

在 HTML5 全屏视频上叠加

显示全屏元素以外的元素(HTML5 全屏 API)

0 投票
1 回答
177 浏览

javascript - 删除 document.onfullscreenchange 全屏 API

我有一个页面正在检查用户是否离开全屏。我想删除/销毁此事件观察器,但无法在描述 API 描述中找到如何执行此操作 这是我的代码:

0 投票
2 回答
1016 浏览

angular - Videogular2 控制外部元素

有没有办法在<vg-player></vg-player>元素之外使用控制器?

我正在尝试在<vg-player>以下内容之外制作全屏按钮:

这是因为我希望这个按钮在另一个地方,而不是在视频的顶部。

上面的代码给了我以下错误:ERROR TypeError: Invalid event target

0 投票
0 回答
192 浏览

javascript - 当浏览器处于全屏模式时禁用键盘事件

当用户单击一个按钮时,我想让我的浏览器进入全屏模式,当我的浏览器处于全屏模式时,我想禁用所有键盘事件(阻止用户退出全屏)。退出全屏的唯一方法是单击页面内另一个按钮的事件。

当我使用Fullscreen_API时,我得到黑色背景,这对用户来说看起来很尴尬。

我试过这个package,它的工作原理与此相同,F11但我唯一的问题是禁用键盘事件。

我试图阻止使用以下代码退出。

令人惊讶的是,当我按下 时,我什至无法控制它esc。有什么办法吗?

提前致谢。

0 投票
0 回答
97 浏览

javascript - 如何让psvita浏览器全屏?

我想写一个 html 页面让我的 psvita 浏览器全屏显示,并且 JavaScript API 像requestFullscreen(), mozRequestFullScreen(), msRequestFullscreen(),webkitRequestFullScreen()不起作用。

这是html: <button onclick="launchFullscreen(document.documentElement)">FullScreen</button>

这是 JavaScript:

0 投票
1 回答
6158 浏览

javascript - 使用 Google Maps API 自定义全屏控制行为

有没有办法使用谷歌地图 API 拦截全屏控件的默认行为?

在此处输入图像描述

当您按下控件而不消除 UI 时,我想防止自定义全屏行为。如果用户单击控件,则地图将在容器内增加大小。

如果这是不可能的,我想知道实现这一点的最佳方法是否是创建附加到点击事件的叠加层。

或者我什至不需要为此使用覆盖OverlayView 类,我可以只使用样式和点击事件来管理它:

CSS:

html:

资源

关于如何实现这一目标的最佳方法的任何建议?

0 投票
0 回答
481 浏览

ipad - HTML5 视频在 iPad 上无法全屏显示

我在我的网站上设置了 HTML5视频

它可以在除 iPad 之外的所有(经过测试的)设备上完美运行。即,全屏按钮不起作用,视频无法全屏显示。

关于原因的任何想法?

我应该使用 webkitbeginfullscreen 吗?或者使用 ontouchstart insted of click?

JS: