index

index.html

@@ -45,16 +45,26 @@
     <script type="text/javascript">
         document.domain = document.domain.split(".").slice(-2).join(".");
     </script>
-    <meta name="viewport" id="viewportMeta">
     <script>
-        var initViewport = function (height) {
-            var metaEl = document.querySelector("#viewportMeta");
-            var content = "height=device-height" + ",width=device-width,initial-scale=1.0,user-scalable=no";
-            metaEl.setAttribute('name', 'viewport');
-            metaEl.setAttribute('content', content);
-        }
-        var realHeight = window.innerWidth > window.innerHeight ? window.innerWidth : window.innerHeight
-        initViewport(realHeight);
+        //获取原窗口的高度
+        var originalHeight = document.documentElement.clientHeight || document.body.clientHeight;
+        window.addEventListener('resize',function () {
+            //键盘弹起与隐藏都会引起窗口的高度发生变化
+            var resizeHeight = document.documentElement.clientHeight || document.body.clientHeight;
+            // 1. 从app自身的Webview高度方面去考虑
+            if (resizeHeight - 0 < originalHeight - 0) { // resizeHeight<originalHeight证明窗口被挤压了
+                plus.webview.currentWebview().setStyle({
+                    height: originalHeight //强设置为原高度
+                });
+            }
+            // 2. 从h5自身角度去解决
+            if (resizeHeight - 0 < originalHeight - 0) { // resizeHeight<originalHeight证明窗口被挤压了
+                //    可以去操作dom 进行隐藏按钮  // xxx.style.display='none';
+                //隐藏的手段就有很多了 可以z-index为负数、opacity透明度等等
+            } else {
+                // 还原按钮的显示 // xxx.style.display='';
+            }
+        });
     </script>
 </head>