Add a screen element for vnc_lite.html

Makes it clearer where the remote screen will be created.

diff --git a/vnc_lite.html b/vnc_lite.html
index 2398bea2cbbc810804abe6af54fe4f687dfe341a..898187a8e6438a215e503ad407fbe940ec7ed2c8 100644 (file)
--- a/vnc_lite.html
+++ b/vnc_lite.html
@@ -55,6 +55,11 @@
             cursor: pointer;
         }
 
+        #screen {
+            flex: 1; /* fill remaining space */
+            overflow: hidden;
+        }
+
     </style>
 
     <!-- Promise polyfill for IE11 -->
@@ -172,7 +177,7 @@
         url += '/' + path;
 
         // Creating a new RFB object will start a new connection
-        rfb = new RFB(document.body, url,
+        rfb = new RFB(document.getElementById('screen'), url,
                       { credentials: { password: password } });
 
         // Add listeners to important events from the RFB module
@@ -192,5 +197,8 @@
         <div id="status">Loading</div>
         <div id="sendCtrlAltDelButton">Send CtrlAltDel</div>
     </div>
+    <div id="screen">
+        <!-- This is where the remote screen will appear -->
+    </div>
 </body>
 </html>