编辑:下面接受了一个答案,但对于最终担任我职务的人来说,主要问题是firefox默认情况下暂时启用了全屏-api.unprefix,然后在更新中更改了再次需要一个前缀。此外,如果你搜索:config for" fullscreen"它不会显示"全屏-api。"
我使用js长时间使用全屏网页的一些代码不再有效。
我已经检查了mdn(https://developer.mozilla.org/en-US/docs/Web/API/Element/requestFullScreen)并且似乎没有任何变化,但出于某种原因,我无法在我的任何浏览器中全屏显示网站(我已经测试过Chrome ,Firefox和Firefox Developer Edition)。
此外,我给出的错误不是权限之一,但requestFullscreen
似乎不是作为函数存在。
TypeError: document.body.requestFullscreen is not a function
我不知道的是一件大事吗?这可能与我的操作系统有关吗?很遗憾,在不超过6个月之前在我的所有浏览器中工作的旧代码(document.body.requestFullscreen()
)现在都无效。
此外,我已经在最常用的地方对其进行了测试,全屏仍可用于youtube或内置位<video>
标签。
#test {
height: 100px;
width: 100px;
background: orange;
}
&#13;
<button onclick="document.body.requestFullscreen()">Fullscreen document.body</button>
<button onclick="document.documentElement.requestFullscreen()">Fullscreen document.documentElement</button>
<button onclick="document.documentElement.requestFullscreen()">Fullscreen Test Div</button>
<div id="test">Test Div</div>
&#13;
答案 0 :(得分:1)
根据the MDN documentation的浏览器支持部分:
这是一个实验性功能。
Chrome仅支持webkit
前缀。如果您在浏览器中打开full-screen-api.unprefix.enabled
首选项,Firefox仅支持它。 Internet Explorer仅支持ms
前缀。
答案 1 :(得分:1)
以下是实现供应商前缀的全屏api请求的示例:
function toggleFullScreen() {
// Get your full screen element
const video= document.querySelector('.player');
const rfs = video.requestFullscreen || video.webkitRequestFullScreen || video.mozRequestFullScreen || video.msRequestFullscreen;
rfs.call(video);
}
在按钮上“点击”添加事件监听器:
const fullscreenBtn = player.querySelector('.fullscreen-btn');
fullscreenBtn.addEventListener('click', toggleFullScreen);
答案 2 :(得分:0)
我希望这会对某人有所帮助。
因此,我正在使用的网站(svejen.ikbugu.com)上的全屏功能存在问题。
对我来说,IE和Chrome全屏正常运行,但Firefox无法正常运行。没有错误抛出,并且该函数在1秒内执行良好(我读过的地方,如果超过1秒,firefox将阻止执行全屏请求)。我也有带或不带供应商特定前缀的请求,不是吗。
对我有用的是将javascript直接粘贴到html中,而不是将其存储在单独的文件中。现在,它可以完美运行了。
我认为这可能对遇到同样问题的其他人有所帮助...问候。