zhangyupeng
/
Babylon.js


			
				
					
						
						
							12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879
							<!DOCTYPE html>
<html>
<head>
    <title>Inspector - test</title>
    <meta charset='utf-8'/>
    <meta name="viewport" content="width=device-width, user-scalable=no">

    <!--Babylon-->
	<script src="../tools/DevLoader/BabylonLoader.js"></script>

    <style>
        
        html, body {
            width: 100%;
            height:100%;
            margin:0;
            padding:0;
            overflow:hidden;
            font-family:sans-serif;
        }

        /* First try : PG-like */
        /*#game-canvas {
            width:75%;
            height:100%; 
            top:0;
            left:0;
        }
        .fakeToolbar {
            height:150px;
            background-color: #333;
        }
        .mini {
            display:flex;
            height:calc(100% - 150px);
        }
        .fakeBarAgain {
            width:50%;
            background-color: #333;
        }*/
        
        /*Second : sandbox like*/
        #game-canvas {
            position:absolute;
            width:100%;
            height:100%; 
            top:0;
        }
        .fakeFooter {
            position:absolute;
            width:100%;
            height:50px;
            background-color: #333;
            bottom: 0;
        }

    </style>

</head>
<body>
    
    <!-- First try : PG-like 
    <div class="fakeToolbar"></div>
    <div class="mini">
        <div class="fakeBarAgain"></div>
        <canvas id="game-canvas"></canvas> 
    </div>-->
    <!--Second try : Sandbox-like -->
    <canvas id="game-canvas"></canvas>
    <div class="fakeFooter"></div>

    <!--Starting the game-->
    <script>
        BABYLONDEVTOOLS.Loader.require("test/index.js").load(function() {
            new Test('game-canvas');
	    });
	</script>
</body>
</html>