JSFiddle - React, Tailwind, and code Playground

by Tsuneo Yoshioka

HTML

<div id="menuOverlay">
                      <button id="btngameIFrame1" runat="server" type="button" onclick="javascript:document.getElementById('gameIFrame1').style.display = 'block';document.getElementById('gameIFrame2').style.display = 'none';">show editor</button>
                      <button id="btngameIFrame2" runat="server" type="button" onclick="javascript:document.getElementById('gameIFrame1').style.display = 'none';document.getElementById('gameIFrame2').style.display = 'block';">show menu</button>
      </div>
        <div>
            <iframe id="gameIFrame1" style="width: 99%; height: 99%;   display: none; position: absolute;" src="http://jgraph.github.io/mxgraph/javascript/examples/grapheditor/www/index.html"></iframe>
            <iframe id="gameIFrame2" style="width: 99%; height: 99%;   display: block; position: absolute;" src="http://jgraph.github.io/mxgraph/javascript/"></iframe>
        </div>

CSS

body{   
    margin:0 auto; 
    background:#F0F0F0;}
      #menuOverlay {
      position:fixed; /*or  absolute*/
      top: 20px;
      left: 20px;
      z-index: 999; /* or  greater value */
      }