js防止安卓手机软键盘弹出挤压页面导致变形的方法
5防止安卓手机软键盘弹出挤压页面导致变形的方法
输入框定位在底部,手机端打开,输入框聚焦后软键盘打开为什么会瞬间自动关闭呢?
先看看问题:
1.原来是这样的:
2.在苹果手机里面是正常的:
3.到了安卓就是这样:
4.原因就是在安卓中被软键盘顶上来了,而苹果的软键盘是覆盖的(分层)
5.后来用的解决方法是,把当前页面的body固定好,即在当然页面加上这段js:
$('body').height($('body')[0].clientHeight);
- 1
6.成功之后的样子是:
~~~~~~~~~点赞的亲,以后都不会遇到bug~~~~~~~~~~~~~~~~~~~~~~~
js防止安卓手机软键盘弹出挤压页面导致变形的方法的更多相关文章
- 微信浏览器软键盘弹出与页面resize的问题
使用微信打开网页,弹出软键盘时遇到的兼容问题 过去开发中遇到过很多这种情况,页面底部需要固定定位一个按钮,广告栏或者菜单栏,页面中有表单项需要填写,在打开手机虚拟键盘的时候,底部固定定位的元素会处在软 ...
- 点击input框,不让手机软键盘弹出的办法
设置readonly="" <input type="text" readonly="" placeholder="请输入邮 ...
- js 移动端之监听软键盘弹出收起
js 移动端关于页面布局,如果底部有position:fixed的盒子,又有input,当软键盘弹出收起都会影响页面布局.这时候Android可以监听resize事件,代码如下,而ios没有相关事件. ...
- 小米note3,华为手机,软键盘弹出之后,页面上定位的元素布局会乱掉
原因:可能是因为,软键盘弹出时,改变了height,使height:100%,不能达到原来的高度. 解决办法: $(document).ready(function () { $('body').he ...
- Android软键盘弹出,覆盖h5页面输入框问题
之前我们在使用vue进行 h5 表单录入的过程中,遇到了Android软键盘弹出,覆盖 h5页面 输入框 问题,在此进行回顾并分享给大家: 系统:Android 条件:当输入框在可视区底部或者偏下的位 ...
- input获取焦点软键盘弹出影响定位
解决移动端底部fixed和input获取焦点软键盘弹出影响定位的问题$(document).ready(function() { var ...
- Android软键盘弹出时布局问题
最近项目需要做一个类似聊天室的模块,基于Socket实现的,这部分稍后一段时间再做总结,功能上的相关点都实现了小例子也做出来了,最后发现一个比较腻歪的问题就是软键盘弹出时总是会把标题“挤出”屏幕,(无 ...
- 解决react-native软键盘弹出挡住输入框的问题
解决react-native软键盘弹出挡住输入框的问题 写登录页面,整体界面居中之后就出现软键盘弹出挡住输入框,用户体验不好的情况.用了RN官方的KeyboardAvoidingView组件,会有多出 ...
- ionic项目中 软键盘弹出之后的问题:
Android SDK目前提供的软键盘弹出模式接口只有两种: 一是弹出时自动回冲界面,将所有元素上顶: 一种则是不重绘界面,直接将控件元素遮住: 1. ionic 中弹出键盘遮挡住输入框(覆盖 ...
随机推荐
- mysql管理工具percona-toolkit-3简单使用介绍
安装percona-toolkit-3 # -.el6.x86_64.rpm :.el6 -y 1.pt-summary #显示和系统相关的基本信息: [root@master ~]# pt-summ ...
- 51nod--1256 乘法逆元 (扩展欧几里得)
题目: 1256 乘法逆元 基准时间限制:1 秒 空间限制:131072 KB 分值: 0 难度:基础题 收藏 关注 给出2个数M和N(M < N),且M与N互质,找出一个数K满足0 < ...
- MS SQL Server 增删改查
数据插入 语法:INSERT INTO Table_name(field1,field2……fieldN) values(value1,vlaue2,…valueN) 单行插入用户类型 INSERT ...
- 【原创】大数据基础之Logstash(2)应用之mysql-kafka
应用一:mysql数据增量同步到kafka 1 准备mysql测试表 mysql> create table test_sync(id int not null auto_increment, ...
- php 汉字的首字母
<?php//php获取中文字符拼音首字母function getFirstCharter($str){ if(empty($str)) { return ''; } $fchar=ord($s ...
- 18)django-模板的过滤器和tag,自定义simple_tag和filter
模板过滤器是在变量被显示前修改它的值的一个简单方法. 过滤器使用管道字符 . 模板标签(template tag) .标签(tag)定义比较明确,即: 仅通知模板系统完成某些工作的标签. 一:dja ...
- Android:图解四种启动模式 及 实际应用场景解说
在一个项目中会包括着多个Activity,系统中使用任务栈来存储创建的Activity实例,任务栈是一种“后进先出”的栈结构.举个栗子,若我们多次启动同一个Activity.系统会创建多个实例依次放入 ...
- Codeforces Educational Codeforces Round 57 题解
传送门 Div 2的比赛,前四题还有那么多人过,应该是SB题,就不讲了. 这场比赛一堆计数题,很舒服.(虽然我没打) E. The Top Scorer 其实这题也不难,不知道为什么这么少人过. 考虑 ...
- 移动端的dl
https://blog.csdn.net/u013139259/article/details/52143240
- Android UiAutomator - CTS Frame
使用UiAutomator进行UI自动化测试后,生成的测试结果并不是很美观.为了生成一份好看的测试结果(报告),本文将使用CTS框架,当然也可以自己编写一份测试报告框架(如:生成html,excel报 ...