Эх сурвалжийг харах

Fix window/document sizing in firefox.

Another firefox issue is that height: 100% is calculated as 100% of
the containing element even when the containing element is the window.
This means that the size of any sibling element shifts the window size
down by that much and causes the vertical scroll bars to appear. This
doesn't happen in Chrome.

- So instead, put a pad element inside the noVNC_screen element that
  is the size of the control bar. This is hidden by the control bar,
  however, it causes things to be sized correctly.

- Also, rename noVNC_defaultScreen to noVNC_logo.

- Clean some style specification out of the HTML.
Joel Martin 14 жил өмнө
parent
commit
b70ce07706
3 өөрчлөгдсөн 19 нэмэгдсэн , 13 устгасан
  1. 9 6
      include/base.css
  2. 3 3
      include/ui.js
  3. 7 4
      vnc.html

+ 9 - 6
include/base.css

@@ -80,7 +80,7 @@ html {
 }
 
 #noVNC_status_bar {
-  margin-top: 15px;
+  margin-top: 0px;
   padding: 0px;
 }
 
@@ -88,7 +88,6 @@ html {
   font-size: 12px;
   padding-top: 4px;
   width:100%;
-  margin-top: 2px;
 }
 
 .VNC_status_button, #clipboardbutton, #connectbutton {
@@ -131,8 +130,12 @@ html {
 
 /* Do not set width/height for VNC_screen or VNC_canvas or incorrect
  * scaling will occur. Canvas resizes to remote VNC settings */
+#noVNC_screen_pad {
+  margin: 0px;
+  padding: 0px;
+  height: 44px;
+}
 #noVNC_screen {
-  margin-top:40px;
   text-align: center;
   display: table;
   width:100%;
@@ -231,8 +234,8 @@ html {
   right:180px;
 }
 
-/*Default noVNC screen.*/
-#noVNC_defaultScreen {
+/*Default noVNC logo.*/
+#noVNC_logo {
   width:400px;
   margin-left:auto;
   margin-right:auto;
@@ -249,7 +252,7 @@ html {
        1px 1px 0 #000;
 }
 
-#noVNC_defaultScreen span{
+#noVNC_logo span{
   color:green;
 }
 

+ 3 - 3
include/ui.js

@@ -307,7 +307,7 @@ updateState: function(rfb, state, oldstate, msg) {
             klass = "noVNC_status_normal";
             break;
         case 'disconnected':
-            $D('noVNC_defaultScreen').style.display = "block";
+            $D('noVNC_logo').style.display = "block";
             c.value = "Connection";
             c.onclick = UI.connectPanelbutton;
         case 'loaded':
@@ -375,14 +375,14 @@ connect: function() {
     UI.rfb.connect(host, port, password);
     //Close dialog.
     setTimeout(UI.setBarPosition, 100);
-    $D('noVNC_defaultScreen').style.display = "none";
+    $D('noVNC_logo').style.display = "none";
 },
 
 disconnect: function() {
     UI.closeSettingsMenu();
     UI.rfb.disconnect();
 
-    $D('noVNC_defaultScreen').style.display = "block";
+    $D('noVNC_logo').style.display = "block";
     UI.connSettingsOpen = false;
     UI.connectPanelbutton();
 },

+ 7 - 4
vnc.html

@@ -78,8 +78,8 @@
                 value="Settings" id="menuButton"
                 onclick="UI.clickSettingsMenu();">
             <input type="button" id="connectPanelbutton"
-                class="VNC_status_button"  style="width:100px;"
-                onclick="UI.connectPanelbutton()" value="Connection" />
+                value="Connection" class="VNC_status_button"
+                onclick="UI.connectPanelbutton()" />
         </div>
 
         <!-- Clipboard Panel -->
@@ -135,13 +135,16 @@
 
     </div> <!-- End of noVNC-control-bar -->
 
+
     <div id="noVNC_screen">
-        <div id="noVNC_status_bar" class="noVNC_status_bar" style="margin-top: 0px;">
+        <div id="noVNC_screen_pad"></div>
+
+        <div id="noVNC_status_bar" class="noVNC_status_bar">
                 <div id="noVNC_status">Loading</div>
         </div>
         
         <!-- HTML5 Canvas -->
-        <h1 id="noVNC_defaultScreen"><span>no</span><br />VNC</h1>
+        <h1 id="noVNC_logo"><span>no</span><br />VNC</h1>
         <canvas id="noVNC_canvas" width="640px" height="20px">
                     Canvas not supported.
         </canvas>