gpt4 book ai didi

javascript - 使用 HTML 和 JavaScript 的 WebGL 全屏按钮?

转载 作者:行者123 更新时间:2023-12-04 08:01:48 25 4
gpt4 key购买 nike

使用 HTML 和 JavaScript 的 WebGL 全屏按钮?
我已经多次搜索这个主题,但找不到可以工作的东西,但是我确实找到了一个可以将我的页面全屏显示的按钮

<input type="button" value="click to toggle fullscreen" onclick="toggleFullScreen()">
<script>function toggleFullScreen() {
if ((document.fullScreenElement && document.fullScreenElement !== null) ||
(!document.mozFullScreen && !document.webkitIsFullScreen)) {
if (document.documentElement.requestFullScreen) {
document.documentElement.requestFullScreen();
} else if (document.documentElement.mozRequestFullScreen) {
document.documentElement.mozRequestFullScreen();
} else if (document.documentElement.webkitRequestFullScreen) {
document.documentElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
}
} else {
if (document.cancelFullScreen) {
document.cancelFullScreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.webkitCancelFullScreen) {
document.webkitCancelFullScreen();
}
}
}</script>
这确实有效,但不适用于 WebGL 内容。
这是我的 iframe我用于在我的网站上加载 WebGL 内容。
<!DOCTYPE html>
<html>
<body>
<iframe src="WEBGL CONTENT IS HERE"></iframe>
</body>
</html>
如果有人可以提供帮助,那就太好了!

最佳答案

您是否尝试过对 iframe 元素调用 requestFullscreen?
我刚刚写了这个快速测试,它有效:

<div>
<iframe src="https://bbc.com"></iframe>
</div>
<button onclick="toggle()">Make that iframe full screen</button>

<script>
function toggle() {
document.querySelector('iframe').requestFullscreen();
}
</script>
希望这能解决您的问题。

关于javascript - 使用 HTML 和 JavaScript 的 WebGL 全屏按钮?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66427782/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com