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

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

深入理解高度。获取屏幕、webview、软键盘高度

http://www.cnblogs.com/phillyx/

所以要获取屏幕的高度,通过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";
});

MUI - 解决弹出输入法时页面高度变小导致底部上浮的问题的更多相关文章

  1. 解决IOS safari在input focus弹出输入法时不支持position fixed的问题

    该文章为转载 我们在做移动web应用的时候,常常习惯于使用position:fixed把一个input框作为提问或者搜索框固定在页面底部.但在IOS的safari和webview中,对position ...

  2. Android实现弹出输入法时,顶部固定,中间部分上移的效果

    前言 最近做项目时碰到一个问题,在意见反馈里面,提交按钮写到顶部,当用户输入反馈意见或者邮箱手机号时,弹出的输入法会上移整个页面,导致提交按钮显示不了. 很明显,这样的界面是非常不友好的,找了一些资料 ...

  3. Android中PopupWindow中有输入框时无法弹出输入法的解决办法

    PopupWindow window=new PopupWindow(view, LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT); //必须让p ...

  4. IOS微信点击input弹出输入法,关闭后页面留白解决方案

    场景:IOS用微信点击input框弹出输入法后 不管你是输入信息,还是不输入直接点完成关闭输入法,都会导致页面被挤上去后产生留白,从而改变页面布局             解决方法: 给input添加 ...

  5. ios兼容 input输入时弹出键盘框 页面整体上移键盘框消失后在ios上页面不能回弹的问题

    前端h5混合开发手机端ios  当有input输入时,手机下方弹出键盘使页面上移,当输入完成,键盘消失后页面显示回到原位,但实际不能点击(可点击上方区域,有反应),也就是说实际是没有回弹. 解决办法: ...

  6. JQuery弹出菜单时禁止页面(body)滚动

    最近在做手机端的弹出菜单,但是菜单弹出来后滑动手机屏幕的话页面滚动总是会将菜单滑上去,体验非常不好,所以查了一下弹出菜单时禁止页面滚动的方法,整理如下: 方法一:弹出菜单时给body和html添加一个 ...

  7. 在子页面使用layer弹出层时只显示遮罩层,不显示弹出框问题

    最近子页面使用layer弹出层时只显示遮罩层,不显示弹出框,这个问题搞了很久,最后才发现,在子页面上使用弹出框时,如果只使用layer.alert()或者layer.open()时,会默认在当前页面弹 ...

  8. mui弹出输入法遮住input表单元素

    转自https://www.cnblogs.com/devilyouwei/p/6293190.html mui弹出输入法遮住input表单元素   问题如下:当我用mui开发app时,在mui-sc ...

  9. jQuery插件--zTree中点击节点实现页面跳转时弹出两个页面的问题

    这是第一次使用zTree,所以在使用之前我要先写一个demo来学习一下.我们要注意的是,zTree是一个jQuery插件,所以我们在导入zTree的js文件之前要先导入jQuery的js文件. 我们先 ...

随机推荐

  1. 同一浏览器中同一JavaWeb程序不共享session方法

    版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/b2084005/article/details/302227351.要求 在使用struts1开发J ...

  2. Redis源码解析:26集群(二)键的分配与迁移

    Redis集群通过分片的方式来保存数据库中的键值对:一个集群中,每个键都通过哈希函数映射到一个槽位,整个集群共分16384个槽位,集群中每个主节点负责其中的一部分槽位. 当数据库中的16384个槽位都 ...

  3. 通过游戏学python 3.6 第一季 第二章 实例项目 猜数字游戏--核心代码--猜测次数 可复制直接使用 娱乐 可封装 函数

      猜数字游戏--核心代码--猜测次数   #猜数字--核心代码--猜测次数 number=33 amount=3 count=0 while count<=amount: conversion ...

  4. solr高亮及摘要

    修改了原文的一点内容:原文地址为:http://www.cnblogs.com/rainbowzc/p/3680343.html 高亮显示 两种方法: 1.在程序里通过设置query返回高亮信息 pu ...

  5. 访问者模式(Visitor、Element、accept、ObjectStructure、)(操作外置,与数据结构分离)

    访问者模式表示一个作用于某对象结构中的各元素的操作,它使你可以在不改变各元素类的前提下定义作用于这些元素的新操作.从定义可以看出结构对象是使用访问者模式的必备条件,而且这个结构对象必须存在遍历自身各个 ...

  6. Spring 的初次见面

    简介: Spring Framework 是一个开源的企业级应用程序框架,为构建满足企业级需求的应用程序提供了大量的工具集.推出该框架的原因是在时候用J2EE进行开发是会提高复杂性. Spring三大 ...

  7. python实例 字典

    #! /usr/bin/python x={'a':'aaa','b':'bbb','c':12} print (x['a']) print (x['b']) print (x['c']) for k ...

  8. javascript之键盘事件的方法

    键盘事件包含onkeydown.onkeypress和onkeyup这三个事件 事件初始化 function keyDown(){} document.onkeydown = keyDown; //论 ...

  9. 强力Django+杀手级xadmin开发在线教育网站

    强力Django+杀手级xadmin开发在线教育网站采用 Python3.7全新开发 整个课程都看完了,这个课程的分享可以往下看,下面有链接,之前做java开发也做了一些年头,也分享下自己看这个视频的 ...

  10. 2019-8-30-win10-uwp-好看的时间选择控件

    title author date CreateTime categories win10 uwp 好看的时间选择控件 lindexi 2019-08-30 08:57:20 +0800 2018-0 ...