Home > Back-end >  Remove everything from the page and replace it with the unity game onclick
Remove everything from the page and replace it with the unity game onclick

Time:11-11

The title is self-explanatory. I'm attempting to conceal a hidden href that, when clicked, erases everything on the page, leaving it blank for a second before inserting the unity game as the whole page.

Here's what I've got so far.

<!DOCTYPE html>
<html>
  <script>
    function wipeHTML() {
      document.documentElement.innerHTML = nothing; //NEED HELP HERE
      then wait 1 second
      document.documentElement.innerHTML = unity game loads; //NEED HELP HERE
    }

  </script>
  <!-- UNITY STUFF -->

  <head>
    <link rel="stylesheet" href="TemplateData/style.css">
    <script src="TemplateData/UnityProgress.js"></script>
    <script src="TemplateData/unityloader41.js"></script>
    <script>
      var gameInstance = UnityLoader.instantiate("gameContainer", "Build/slope.json", {
        onProgress: UnityProgress,
        Module: {
          onRuntimeInitialized: function() {
            UnityProgress(gameInstance, "complete")
          }
        }
      });

    </script>
  </head>

  <body style="margin: 0; overflow: hidden;">
    <div class="webgl-content">
      <div id="gameContainer" style="width: 100%; height: 100%; margin: 0;"></div>
    </div>
  </body>
  <!-- UNITY STUFF END -->
  <h1>
    <a href="javascript:wipeHTML">wipe everything</a>
  </h1>
  <div>
    <h1>
      hello
    </h1>
    <h3>
      erase me
    </h3>
  </div>
<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

Tell me what I'm doing wrong!

  • Related