分析:软键盘弹出后,导致页面高度变化

解决方案:软键盘弹出后,修复页面高度

// 监听窗口变化
resizeScreen(){
if (!this.state.isIOS && this.state.isInApp) {
var originHeight = document.documentElement.clientHeight || document.body.clientHeight;
this.$nextTick(()=>{
let bodyE = document.querySelector('.pop-other');
window.addEventListener('resize', function() {
var resizeHeight = document.documentElement.clientHeight || document.body.clientHeight;
if (originHeight < resizeHeight) {
console.log('Android 键盘收起啦!');
// Android 键盘收起后操作
bodyE.style.height = 100+'%';
} else {
console.log('Android 键盘弹起啦!');
// Android 键盘弹起后操作
bodyE.style.height = originHeight+'px';
}
originHeight = resizeHeight;
}, false)
});
}
},

js-解决安卓手机软键盘弹出后,固定定位布局被顶上移问题的更多相关文章

  1. js防止安卓手机软键盘弹出挤压页面导致变形的方法

    5防止安卓手机软键盘弹出挤压页面导致变形的方法 输入框定位在底部,手机端打开,输入框聚焦后软键盘打开为什么会瞬间自动关闭呢? 先看看问题: 1.原来是这样的: 2.在苹果手机里面是正常的: 3.到了安 ...

  2. 周记3——解决fixed属性在ios软键盘弹出后失效的bug

    这周在做空间(“类似”qq空间)项目.首页是好友发表的说说,可以针对每条说说进行评论,评论框吸附固定在屏幕底部.此时,Bug来了...在ios上,软键盘弹出后fixed属性失效了.后来发现,ios绝大 ...

  3. Ionic3学习笔记(九)关于 Android 端软键盘弹出后界面被压缩的问题

    本文为原创文章,转载请标明出处 今天做了一个如下图所示的页面. iOS 端毫无 bug,Android 端却出现了问题.当软键盘弹出后,Android 端的 tabs 移到了软键盘的上面,再仔细一看, ...

  4. input获取焦点软键盘弹出影响定位

    解决移动端底部fixed和input获取焦点软键盘弹出影响定位的问题$(document).ready(function() {                                var ...

  5. Android软键盘弹出时把布局顶上去的解决方法

    原文: 解决Andriod软键盘出现把原来的布局给顶上去的方法(转) 链接:http://blog.sina.com.cn/s/blog_9564cb6e0101g2eb.html 决方法,在main ...

  6. KeyboardUtil【软键盘弹出后输入框上移一定的高度】

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 演示获取软键盘高度并保存,然后根据输入框的原有位置是否被软键盘挡住了,如果被挡住了则将整体页面上移一定的高度,当软键盘隐藏的时候再下 ...

  7. 关于ListView中EditText在软键盘弹出后的焦点问题

    转自:http://www.cnblogs.com/haofei/p/3305030.html 在ListView中,每次弹出软键盘后就会重新调用getView()方法,导致EditText失去焦点. ...

  8. Android 软键盘弹出时把布局顶上去,控件乱套解决方法

    解决办法:方法一:在你的activity中的oncreate中setContentView之前写上这个代码getWindow().setSoftInputMode(WindowManager.Layo ...

  9. Android中软键盘弹出时关于布局的问题

     当在Android的layout设计里面如果输入框过多,则在输入弹出软键盘的时候,下面的输入框会有一部分被软件盘挡住,从而不能获取焦点输入. 解决办法: 方法一:在你的activity中的oncre ...

  10. HTML 在安卓手机端软键盘弹出顶起页面布局的解决办法

    $('body').height($('body')[0].clientHeight); 以上是背景即BODY被顶起的解决办法. 如果是footer被顶起,则可以用判断解决, $('input').f ...

随机推荐

  1. 1+x初级Web的关键词填写

    H5+CSS: 声明HTML网页标准:<!DOCTYPE> 图片标签 img css颜色样式color 定位 position 绝对absolute 相对 relative 外边距:mar ...

  2. [OpenCV实战]13 OpenCV中使用Mask R-CNN进行对象检测和实例分割

    目录 1 背景介绍 1.1 什么是图像分割和实例分割 1.2 Mask-RCNN原理 2 Mask-RCNN在OpenCV中的使用 2.1 模型下载 2.2 模型初始化 2.3 模型加载 2.4 输出 ...

  3. .NET6使用NLog向文件、数据库写数据

    1.Nuget 引入 NLog NLog.Web.AspNetCore NLog.Database(写入数据库使用) 2.创建nlog.config 注意数据库连接字符串需要配置TrustServer ...

  4. 数据库服务器CPU不能全部利用原因分析

    背景 客户凌晨把HIS数据库迁移到配置更高的新服务器,上午业务高峰时应用非常缓慢. 现象 通过SQL专家云实时可视化界面看到大量的绿点,绿点表示会话在等待某项资源,绿点越大说明等待的会话数越多. 进入 ...

  5. [cocos2d-x]关于CC_CALLBACK

    CC_CALLBACK的代码 // new callbacks based on C++11 #define CC_CALLBACK_0(__selector__,__target__, ...) s ...

  6. C++初探索

    C++初探索 前言 C++ 和 C 的区别主要在8个方面: 输入和输出 引用 inline函数 函数默认值 函数重载 模板函数 new 和 delete namespace 我仅对印象不深的地方做了总 ...

  7. Python语法与基本数据类型

    Python语法与基本数据类型 一.Python语法之注释 1.注释 注释就是对一段代码的解释说明 2.注释的写法 1.单行注释:解释说明的文字前面加#号, pycharm中有快捷键 ctrl+? 2 ...

  8. 委派模式——从SLF4J说起

    作者:vivo 互联网服务器团队- Xiong yangxin 将某个通用解决方案包装成成熟的工具包,是每一个技术建设工作者必须思考且必须解决的问题.本文从业内流行的既有工具包入手,解析实现思路,沉淀 ...

  9. Java 进阶P-7.2+P-7.3

    控制反转 很长一段时间里,我对控制反转和依赖注入这两个概念很模糊,闭上眼睛想一想,总有一种眩晕的感觉.但为了成为一名优秀的 Java 工程师,我花了一周的时间,彻底把它们搞清楚了. 紧耦合 在我们编码 ...

  10. drf-drf请求、响应、基于GenericAPIView+5个视图扩展类

    1.反序列化类校验部分源码分析(了解) 1.当我们在视图类中生成一个序列化类对象ser,并且用ser.is_valid()是就会执行校验,校验通过返回True,不通过返回False.首先对象ser和序 ...