Question

我已经完成了太空射击游戏教程并在html文件中运行已编译的webgl应用程序，但我注意到顶部屏幕区域被切断我可以向下滚动并查看游戏应用程序的其余部分，底部显示为预期，如果我按下全屏按钮，显然游戏完全在屏幕上显示，但我想在浏览器中显示整个屏幕而不是全屏模式，另一件事我注意到如果我缩小页面到75％，浏览器中的屏幕显示为预期，但如果我放大到100％，例如，当顶部屏幕区域被切断时，我正在考虑通过js或css进行默认缩放，但有人建议不要依赖它，所以我该怎么办？请帮忙......

100％缩放

缩放75％

这是html文件的代码：

<!DOCTYPE html>
<html lang="en-us">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Unity WebGL Player | SpaceShooter</title>
    <link rel="shortcut icon" href="TemplateData/favicon.ico">
    <link rel="stylesheet" href="TemplateData/style.css">
    <script src="TemplateData/UnityProgress.js"></script>  
    <script src="Build/UnityLoader.js"></script>
    <script>
      var gameInstance = UnityLoader.instantiate("gameContainer", "Build/Build.json", {onProgress: UnityProgress});
    </script>
  </head>
  <body>
    <div class="webgl-content">
      <div id="gameContainer" style="width: 600px; height: 900px;"></div>
      <div class="footer">
        <div class="webgl-logo"></div>
        <div class="fullscreen" onclick="gameInstance.SetFullscreen(1)"></div>
        <div class="title">SpaceShooter</div>
      </div>
    </div>
  </body>
</html>

Unity webgl屏幕在浏览器内被切断

0 个答案: