解决弹出输入法时页面高度变小导致底部上浮的问题

在有输入框的页面，当输入法弹出的时候，底部元素上浮遮盖了输入框，影响页面美观及功能。查找了一下，页面变窄是不可避免的。即使是设置绝对固定也是不可以的。因为webveiw在输入法弹出时候是变化（resize）的。关于document.body.clientheght, screen.height,plus.screen.resolutionHeight的相关区别及联系请查看这

所以要获取屏幕的高度，通过js给一个固定的top

    <nav class="mui-bar mui-bar-tab" id='bottomx'>
            <a class="mui-tab-item mui-active" href="#tabbar">
                <span class="mui-icon mui-icon-home"></span>
                <span class="mui-tab-label">首页</span>
            </a>
            <a class="mui-tab-item" href="#tabbar-with-chat">
                <span class="mui-icon mui-icon-email"><span class="mui-badge">9</span></span>
                <span class="mui-tab-label">消息</span>
            </a>
            <a class="mui-tab-item" href="#tabbar-with-contact">
                <span class="mui-icon mui-icon-contact"></span>
                <span class="mui-tab-label">通讯录</span>
            </a>
            <a class="mui-tab-item" href="#tabbar-with-map">
                <span class="mui-icon mui-icon-gear"></span>
                <span class="mui-tab-label">设置</span>
            </a>
        </nav>

 mui.plusReady(function() {
                //设置bottom绝对位置
                document.getElementById('bottomx').style.top = (plus.display.resolutionHeight - 50) + "px";
            });

来源：http://www.cnblogs.com/phillyx/p/4528468.html