请求全屏刷新对象标记中的数据(html画布) [英] Requesting full screen refreshes data (html canvas) in object tag

问题描述

我在查看页面上有一个按钮，可使带有ID游戏的对象标签全屏显示.

view.html

<object id="game" src="url/file.html"></object>
<span onclick="fullScreen()"></span>

main.js

function fullScreen() {
var elem = document.getElementById("game");
if (elem.requestFullscreen) {
    elem.requestFullscreen();
    document.addEventListener('fullscreenchange', fullScreenExit, false);
} else if (elem.msRequestFullscreen) {
    elem.msRequestFullscreen();
    document.addEventListener('fullscreenchange', fullScreenExit, false);
} else if (elem.mozRequestFullScreen) {
    elem.mozRequestFullScreen();
    document.addEventListener('mozfullscreenchange', fullScreenExit, false);
} else if (elem.webkitRequestFullscreen) {
    elem.webkitRequestFullscreen();
    document.addEventListener('webkitfullscreenchange', fullScreenExit, false);
}
}

问题

单击按钮fullscreen可以正常工作，并使游戏全屏显示但可以刷新游戏.因此，如果用户在第2级游戏中途并决定进入全屏模式，则它将重新启动游戏(再次加载对象).

解决方案

我想您正在Chrome或其他Webkit/Blink浏览器上遇到此问题吗?

对于<object>，他们有一种怪异的行为，当元素不再在文档中时(甚至使用style=display:none; ...

)，他们会卸载其内容.

由于该元素实际上是与活动文档分离的，因此它在这里也会触发.

我想您可以做的不多，尽管您可能想要提交错误报告，但我强烈建议您尝试使用<iframe>进行尝试，因为它不会受此已有多年错误的困扰...

_{Ps:它是< object>的data="url，而不是src="..}

I have a button on the view page that makes the object tag with id game full screen.

view.html

<object id="game" src="url/file.html"></object>
<span onclick="fullScreen()"></span>

main.js

function fullScreen() {
var elem = document.getElementById("game");
if (elem.requestFullscreen) {
    elem.requestFullscreen();
    document.addEventListener('fullscreenchange', fullScreenExit, false);
} else if (elem.msRequestFullscreen) {
    elem.msRequestFullscreen();
    document.addEventListener('fullscreenchange', fullScreenExit, false);
} else if (elem.mozRequestFullScreen) {
    elem.mozRequestFullScreen();
    document.addEventListener('mozfullscreenchange', fullScreenExit, false);
} else if (elem.webkitRequestFullscreen) {
    elem.webkitRequestFullscreen();
    document.addEventListener('webkitfullscreenchange', fullScreenExit, false);
}
}

The Problem

When the button fullscreen is clicked, it works fine and makes the game full screen BUT it refreshes it. So, if the user is midway in a game on level 2 and decides to go fullscreen, it restarts the game (loads the object again).

解决方案

I guess you are experiencing this on Chrome or other Webkit/Blink browser?

They have a weird behavior regarding <object>, where they unload its content when the element is not in the document anymore (or even just with style=display:none;...

That would make sense it fires here too since the element is actually detached from the active document.

Not much you can do I guess, while you may want to file a bug report, I would strongly suggest you try from an <iframe> instead, which doesn't suffer from this few years old bug...

_{Ps: it's data="url for <object>, not src="..}

这篇关于请求全屏刷新对象标记中的数据(html画布)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！