MUI填坑记5-弹出输入法与CSS之vh,vw

css3的新特性vh,vw使我们响应式布局更加方便,然而,在实际手机app制作时,会出现一种情况,如果大部分都是用vh来布局的,当输入法弹出的时候,所有用vh布局的都会被缩小,因为弹出输入法后,此时的vh是减去输入法高度后的屏幕高度的1%,解决思路是,强制设置webview的高度
代码如下:

mui.plusReady(function() {
                var a = plus.android.invoke(plus.android.currentWebview(), "getHeight");
                var b = plus.navigator.getStatusbarHeight();
                var c = plus.screen.resolutionHeight;
                var d = (c - a - b);
                plus.webview.currentWebview().setStyle({
                    height: d
                });         
            })

但是这种方法解决后会有个bug,就是当输入的位置很低时,输入法会把输入框盖住,当然,这个解决的思路也很多,比如点击不弹出输入法而打开新窗口,新窗口顶部去放一个输入框,这样输入法不会盖住。。。

再或者如果愿意的话在js代码里面去搞定

你可能感兴趣的:(MUI填坑记5-弹出输入法与CSS之vh,vw)